ImageColorPicker.com

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

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

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

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

6.47 до 1
Контраст
AA
Резултат за текст
Добро

Споредено: #FFFFFF на #8631C3

Текст

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

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

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

    Исполнува

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

    Потребни се уште 0.53

    Не успеа

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

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

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

    Исполнува
6.47 на 1. Текст: ги исполнува AA, не ги исполнува AAA. Компоненти на интерфејсот: задоволува.
Како се проверува ова
Споредени бои (по мешање)
Текст #FFFFFF на позадина #8631C3
Релативна осветленост
Текст 1.0000, позадина 0.1120
Формула
(L1 + 0.05) / (L2 + 0.05) каде што L1 е осветленоста на посветлата боја а L2 на потемната.
Точен однос
6.4794 на 1, прикажано како 6.47 на 1. Прикажаната вредност е отсечена, не заокружена, така што никогаш не изгледа подобро отколку што е. Точната вредност е таа што се споредува со барањето.

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

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

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

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

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

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

Текст
#ffffff
Позадина
#8631c3

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