Проверка контрастности цветов

Проверьте коэффициент контрастности двух цветов по 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, поэтому достаточно скопировать адресную строку и отправить ссылку — у получателя инструмент откроется в том же состоянии.