Перевірка контрастності кольорів

Перевірте коефіцієнт контрастності двох кольорів за WCAG AA/AAA

Про цей калькулятор

Перевірка контрастності кольорів обчислює коефіцієнт контрастності WCAG 2.x між кольором тексту й тла за формулою відносної яскравості (L1 + 0,05) / (L2 + 0,05). Вона приймає формати #rgb, #rrggbb і rgb(r,g,b) та показує точний коефіцієнт, яскравість обох кольорів і позначки відповідності рівням AA та AAA для звичайного (4,5:1 / 7:1) і великого тексту (3:1 / 4,5:1). Некоректні кольори дають помилку. Незамінно для доступного вебдизайну.

«Перевірка контрастності кольорів»: як користуватися

  1. Введіть або вставте вхідні дані в поле.
  2. Перегляньте результат — він оновлюється миттєво під час введення.
  3. За потреби налаштуйте параметри під своє завдання.
  4. Скопіюйте URL сторінки, щоб поділитися саме цим результатом.

Типові приклади

  • #000000 на #ffffff → 21,0000:1 — відповідає всім рівням AA та AAA
  • #777777 на #ffffff → 4,4781:1 — трохи не дотягує до AA для звичайного тексту, відповідає AA для великого
  • #0066cc на #ffffff → 5,5666:1 — AA відповідає, AAA для звичайного тексту — ні
  • #ffcc00 на #333333 → 8,3564:1 — відповідає AAA для тексту будь-якого розміру

Поширені запитання

«Перевірка контрастності кольорів»: як це працює?

Введіть або вставте вхідні дані, й інструмент обробить їх прямо у вашому браузері та одразу покаже результат. Нічого з того, що ви вводите, не надсилається на сервер — усі обчислення відбуваються на вашому пристрої.

«Перевірка контрастності кольорів»: коли це знадобиться?

Він стане в пригоді для розробки, налагодження, дизайну й адміністрування — щоразу, коли потрібно швидко виконати це перетворення чи перевірку, нічого не встановлюючи й не довіряючи свої дані сторонньому сервісу.

Наскільки надійні результати?

Інструмент безпосередньо реалізує відповідний стандарт або специфікацію, тож його результат збігається з тим, що видає сумісне програмне забезпечення. Граничні випадки, як-от порожні чи некоректні вхідні дані, чітко повідомляються, а не призводять до тихої помилки.

Чи можна поділитися конкретним результатом з кимось?

Так. Ваші вхідні дані оновлюють URL, тож достатньо скопіювати адресний рядок і надіслати посилання — той, хто його відкриє, побачить інструмент у тому самому стані.