Оперативна
Проверка на цветовия контраст
Реклама
Preview
Normal Text (16px)
Large Text (24px)
Contrast Ratio
21.00:1
WCAG Compliance
Normal Text
✓
AA Pass
✓
AAA Pass
Large Text (18pt+ or 14pt+ bold)
✓
AA Pass
✓
AAA Pass
UI Components & Graphics
✓
AA Pass
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
Black on White
White on Blue
White on Dark Gray
Въведете своите цветови комбинации по-долу, за да ги тествате с нашия инструмент за проверка на цветовия контраст и незабавно да видите дали отговарят на стандартите за достъпност.
Как работи нашата програма за проверка на цветовия контраст
Въведете своите цветове за преден план и заден план, като използвате RGB шестнадесетични стойности или ги изберете директно с Инструмента за избор на цвят.
- Коригирайте Алфа, за да промените колко прозрачен е цветът на предния план.
- Използвайте плъзгача Лекота, за да направите цвета да изглежда по-светъл или по-тъмен.
След това нашият инструмент изчислява съотношението на контраста и го проверява спрямо указанията на WCAG:
- WCAG 2.0 ниво AA
- Най-малко 4,5:1 за нормален основен текст
- Най-малко 3:1 за голям текст
- WCAG 2.1 (ПИ и графики)
- Най-малко 3:1 за икони, граници и други компоненти на интерфейса
- WCAG ниво AAA
- Най-малко 7:1 за нормален текст
- Най-малко 4,5:1 за голям текст
Голям текст означава или:
- 14 pt (около 18,66 пиксела) и получерен, или
- 18 pt (около px) или по-големи
Можете да използвате капетката в инструмента за избор на цвят, за да вземете точни цветове от всичко на вашия екран.
За връзки, които разчитат само на цвета, за да се откроят, използвайте нашия инструмент за проверка на цветовия контраст, за да сте сигурни, че отговарят на стандартите за достъпност и остават лесни за четене от всички.