Інструменти для кольорів

Перевірка контрасту кольорів: WCAG AA і AAA – безкоштовно

Безкоштовно, без реєстрації, працює у вашому браузері. Перевірте, чи читається текст на фоні, за коефіцієнтом контрасту WCAG, подивіться результати AA і AAA для звичайного й великого тексту та елементів керування й отримайте найближчий колір, що проходить перевірку.

Великий текст виглядає так

Звичайний основний текст виглядає так. Швидка руда лисиця перестрибує через ледачого пса, а дрібний шрифт, як-от підпис, розташований нижче.

Дрібний текст: підпис 14px.

Кнопка
Коефіцієнт контрасту13.08:1
  • Звичайний текст, AA: ПройденоОсновний текст, щонайменше 4.5:1
  • Звичайний текст, AAA: ПройденоПосилений, щонайменше 7:1
  • Великий текст, AA: Пройдено18pt+ або 14pt+ жирний, щонайменше 3:1
  • Великий текст, AAA: ПройденоПосилений, щонайменше 4.5:1
  • Значки й елементи керування, AA: ПройденоКнопки, рамки, лінії графіків: 3:1

Використовується формула контрасту WCAG 2. Коефіцієнти ніколи не округлюються вгору, тож 4.49:1 не вважається 4.5:1. Перевірка відбувається на вашому пристрої.

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

100% безкоштовно
Користуйтеся скільки завгодно. Без реєстрації, без водяних знаків, без встановлення.
Конфіденційність за задумом
Те, що ви вводите, залишається у вашому браузері й ніколи не надсилається нам.
Працює на будь-якому пристрої
Працює в браузері на Windows, Mac, Linux, Android та iPhone. Застосунок не потрібен.

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

  1. Введіть колір тексту й колір фону або виберіть їх.
  2. Подивіться коефіцієнт контрасту й результати перевірки.
  3. Якщо перевірку не пройдено, натисніть запропонований колір, що її проходить.

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

Який коефіцієнт контрасту потрібен?
WCAG AA вимагає 4.5:1 для звичайного тексту й 3:1 для великого тексту та елементів інтерфейсу, як-от кнопки й іконки. AAA вимагає 7:1 і 4.5:1.
Що вважається великим текстом?
Щонайменше 18 пунктів (24px) звичайним шрифтом або 14 пунктів (приблизно 18.7px) жирним.
Чи враховуються прозорі кольори тексту?
Так. Напівпрозорий колір тексту змішується з фоном перед вимірюванням контрасту.
Чому 4.49:1 не проходить?
WCAG забороняє округлювати коефіцієнти вгору, тож усе нижче 4.5:1 не відповідає AA для звичайного тексту.
Перевірка контрасту кольорів — це безкоштовно?
Так. Користуватися можна безкоштовно, без реєстрації й без встановлення.

Довідка й посібники (англійською)

Схожі інструменти