بررسی کنتراست رنگ
Preview
Normal Text (16px)
Large Text (24px)
Contrast Ratio
WCAG Compliance
Normal Text
Large Text (18pt+ or 14pt+ bold)
UI Components & Graphics
WCAG Standards
Normal Text
- AA: 4.5:1 minimum
- AAA: 7:1 minimum
Large Text
- AA: 3:1 minimum
- AAA: 4.5:1 minimum
UI Components
- AA: 3:1 minimum
Common Combinations
نحوه کار بررسی کننده کنتراست رنگ ما
رنگ های پیش زمینه و پس زمینه را با استفاده از مقادیر شش ضلعی RGB وارد کنید، یا مستقیما با Color Picker انتخاب کنید.
می توانی:
- آلفا را تنظیم کنید تا میزان شفافیت رنگ پیش زمینه تغییر کند.
- از اسلایدر Lightness استفاده کنید تا رنگ روشن تر یا تیره تر به نظر برسد.
ابزار ما سپس نسبت کنتراست را محاسبه کرده و آن را با دستورالعمل های WCAG مقایسه می کند:
- سطح AA WCAG 2.0
- حداقل ۴.۵:۱ برای متن اصلی معمولی
- حداقل ۳:۱ برای متن بزرگ
- WCAG 2.1 (رابط کاربری و گرافیک)
- حداقل ۳:۱ برای آیکون ها، حاشیه ها و سایر اجزای رابط کاربری
- سطح AAA WCAG
- حداقل ۷:۱ برای متن معمولی
- حداقل نسبت ۴.۵:۱ برای متن بزرگ
متن بزرگ به معنای یکی از موارد زیر است:
- ۱۴ امتیاز (حدود ۱۸.۶۶ پیکسل) و بولد، یا
- ۱۸ امتیاز (حدود پیکس) یا بیشتر
می توانید با استفاده از قطره چکان در Color Picker رنگ های دقیق را از هر چیزی روی صفحه خود بگیرید. این کار تست طراحی ها، دکمه ها یا پس زمینه های واقعی را آسان می کند.
برای لینک هایی که فقط به رنگ تکیه دارند تا برجسته شوند، از بررسی کننده کنتراست رنگ ما استفاده کنید تا مطمئن شوید استانداردهای دسترسی پذیری را رعایت کرده و برای همه آسان برای خواندن باقی می مانند.
مستندات API به زودی منتشر میشود
Documentation for this tool is being prepared. Please check back later or visit our full API documentation.