Проверувач на контраст на бои

Провери ги твоите бои

Тестирај комбинации на бои за да се осигураш дека ги исполнуваат WCAG стандардите за пристапност за читливост на текстот.

1.00:1

Контраст

Не успеа

Многу лошо

Нормален текст

AA (4.5:1)

AAA (7:1)

Голем текст

AA (3:1)

AAA (4.5:1)

Боја на текст

Боја на позадина

Брзи поправки

Наслов на преглед

Брзиот кафеав лисец скока преку мрзливото куче

Пример за мал текст (12px)

Текст

#000000

Позадина

#2596be

WCAG стандарди

Ниво AA

Минимален сооднос на контраст од 4.5:1 за обичен текст и 3:1 за голем текст. Потребен за повеќето веб-сајтови.

Ниво AAA

Подобрен сооднос на контраст од 7:1 за обичен текст и 4.5:1 за голем текст. Препорачано за оптимален пристап.

Недоволен контраст за сите големини на текст - не ги исполнува WCAG стандардите.

Пресметај го контрастниот однос на текст и позадински бои.

Избери боја користејќи го алатот за избор на боја за боја на текст и позадина или внеси боја во RGB хексадецимален формат (на пр. #259 или #2596BE). Можеш да го подесиш слајдерот за да избереш боја. Насоките за пристапност на веб содржини (WCAG) имаат специфична насока за да се осигура дали текстот е читлив за луѓе со вид. Овие критериуми користат посебен алгоритам за мапирање на комбинации на бои во споредливи соодноси. Користејќи ја оваа формула, WCAG наведува дека еден 4.5:1 сооднос на контраст на бојата со текстот и неговата позадина е соодветен за регуларен (текст за тело), а големиот текст (18+ pt редовен, или 14+ pt болд) треба да има најмалку 3:1 сооднос на контраст на бојата.

Клучни карактеристики

Пресметка на контраст во реално време
Проверка на усогласеност со WCAG AA & AAA
HSL лизгачи за прецизно подесување
Повеќе формати за преглед

Напредни алатки

Автоматско поправање на боја
Примери за текст и позадина
Детекција на име на боја
Извоз на резултати

Најчесто поставувани прашања

За WCAG AA усогласеност, нормалниот текст бара минимален контрастен однос од 4,5:1, додека големиот текст (18pt или 14pt задебелен) бара 3:1.

WCAG AAA бара поголеми контрастни односи: 7:1 за нормален текст и 4,5:1 за голем текст, во споредба со AA кои бараат 4,5:1 и 3:1 соодветно.

Користи ја нашата функција за автоматска поправка за да прилагодиш текст или позадински бои, при што ќе ја задржиш дизајнерската намера, или рачно прилагоди ги боите со HSL лизгачите со визуелни индикатори што ги покажуваат оптималните зони за AA/AAA усогласеност.

Зелените зони и ознаките AA/AAA ги покажуваат оптималните опсези за постигнување WCAG усогласеност. Насоките (Посветло/Потемно) ти укажуваат кон подобар контраст врз основа на твојата тековна комбинација на бои.

Да, можеш да внесеш кој било хекс код на боја или да го користиш избирачот на бои за да одбереш сопствени бои. URL-то се ажурира автоматски за да можеш да споделиш одредени комбинации на бои.