Skip to content
Соответствие WCAG 2.1

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

Проверяйте соответствие пар цветов стандартам доступности WCAG AA и AAA. Мгновенный результат для обычного и крупного текста.

Пара цветов
Выберите цвет текста и фон
Пример текста
Съешь же ещё этих мягких французских булок да выпей чаю
Коэффициент контрастности
18.89
: 1
APCA (WCAG 3): Lc 105 · осн. текст
Соответствие WCAG
Обычный текст (AA)Прошёл
Обычный текст (AAA)Прошёл
Крупный текст (AA)Прошёл
UI-компоненты (3:1)Прошёл
Требования
AA Обычный
4.5 : 1
AAA Обычный
7 : 1
AA Крупный текст
3 : 1
UI / иконки
3 : 1
Симуляция дальтонизма
Aa
Обычное зрение
18.89:1
Aa
Protanopia
18.89:1
Aa
Deuteranopia
18.89:1
Aa
Tritanopia
19.00:1

Приблизительная симуляция (sRGB) — помогает убедиться, что пара остаётся различимой при разных типах дальтонизма.

Как это работает

Шаг 1
Выберите цвета

Используйте пипетку или впишите HEX-значения для текста и фона.

Шаг 2
Получите коэффициент

Мгновенно считаем коэффициент контрастности по формуле относительной светимости WCAG 2.1.

Шаг 3
Проверьте соответствие

Смотрите, проходит ли пара WCAG AA или AAA для обычного и крупного текста.

Шаг 4
Проверьте тёмный режим

Поменяйте цвет текста и фон местами, чтобы протестировать светлую и тёмную темы.

Часто задаваемые вопросы

Другие инструменты UIXColors, которые хорошо дополняют «Проверка контрастности WCAG».

Скопировано