ImageColorPicker.com

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

Тестирај го контрастниот однос помеѓу преден и позадински бои за да осигураш пристапност.

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

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

10.43 до 1
Контраст
AAA
Резултат за текст
Многу добро

Споредено: #000000 на #9EC361

Текст

16px, Регуларно (400)

Се брои како обичен текст.

  • AA (WCAG 1.4.3): најмалку 4.5:1

    Исполнува

  • AAA (WCAG 1.4.6): најмалку 7:1

    Исполнува

UI компоненти и графика

Икони, рабови на влезни полиња, индикатори за фокус и други делови кои треба да ги видиш за да го користиш интерфејсот.

  • AA (WCAG 1.4.11): најмалку 3:1

    Исполнува
10.43 на 1. Текст: ги исполнува AA, ги исполнува AAA. Компоненти на интерфејсот: задоволува.
Како се проверува ова
Споредени бои (по мешање)
Текст #000000 на позадина #9EC361
Релативна осветленост
Текст 0.0000, позадина 0.4716
Формула
(L1 + 0.05) / (L2 + 0.05) каде што L1 е осветленоста на посветлата боја а L2 на потемната.
Точен однос
10.4324 на 1, прикажано како 10.43 на 1. Прикажаната вредност е отсечена, не заокружена, така што никогаш не изгледа подобро отколку што е. Точната вредност е таа што се споредува со барањето.

Големина на текст: 16px, Регуларно (400)

Се брои како обичен текст. Голем текст е најмалку 24px (18pt), или најмалку 18.67px (14pt) кога е дебел (тежина 700 или повеќе). Големините се прикажани исечени, не заокружени.

Се брои како обичен текст. Голем текст е најмалку 24px (18pt), или најмалку 18.67px (14pt) кога е дебел (тежина 700 или повеќе). Големините се прикажани исечени, не заокружени.

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

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

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

Текст
#000000
Позадина
#9ec361

WCAG стандарди

Ниво AA

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

Ниво AAA

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

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

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

Избери боја користејќи го алатот за избор на боја за боја на текст и позадина или внеси боја во 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-то се ажурира автоматски за да можеш да споделиш одредени комбинации на бои.