Проверка контраста цвета
Укажите цвет текста и фона и сразу увидите коэффициент по WCAG 2.2 и результат AA или AAA.
Этот инструмент вычисляет коэффициент контраста между выбранными вами цветом текста и фона по формуле относительной яркости WCAG 2.2. Цвет можно указать через палитру или как HEX, RGB либо HSL, включая сокращённый HEX. Результат показывается вместе с живым предпросмотром текста, кнопки и ссылки в реальном размере, так что можно оценить не только число, но и внешний вид. Если вы вводите полупрозрачный (альфа) цвет, инструмент смешивает его с выбранным фоном перед расчётом.
Результат сравнивается с четырьмя порогами: AA 4,5:1 и AAA 7:1 для обычного текста, AA 3:1 и AAA 4,5:1 для крупного текста и 3:1 для элементов интерфейса и графики. Если коэффициент не дотягивает, инструмент предлагает ближайший проходящий цвет с сохранением того же оттенка, и это предложение можно применить одним нажатием. В режиме палитры можно ввести от 2 до 6 цветов и увидеть коэффициент всех пар в одной таблице.
Эта проверка вычисляет только числовой коэффициент контраста, она не учитывает другие факторы читаемости, такие как шрифт, межбуквенное расстояние или визуальный шум вокруг текста, и не сканирует за вас реальную страницу. Разные виды дальтонизма воспринимают один и тот же коэффициент по-разному, поэтому прошедший порог результат не гарантирует комфортное чтение для всех. Полноценная проверка доступности требует также тестирования с реальными пользователями или программой чтения с экрана.
Частые вопросы
Каким должен быть текст, чтобы считаться крупным?
По WCAG крупным считается текст примерно от 18 пунктов (24 пикселя) обычного начертания или от 14 пунктов (18,5 пикселя) жирного; всё, что меньше, должно проходить более строгие пороги обычного текста.
К чему стремиться, к AA или к AAA?
AA это базовый уровень, ожидаемый на большинстве сайтов; AAA строже и рекомендуется, когда доступность в приоритете, но его труднее достичь, сохраняя фирменные цвета.
Если коэффициент проходит, значит ли это, что дизайн полностью доступен?
Нет, коэффициент контраста лишь один из факторов, на читаемость также влияют шрифт, начертание, межбуквенное расстояние и окружающий контент, поэтому пройденный порог не заменяет более полную проверку доступности.
Сохраняются ли где-то введённые цвета?
Нет, все вычисления выполняются полностью в вашем браузере, ни один цвет и ни одна палитра не покидают ваше устройство.
