Контрастность WCAG 2.1
Текст должен быть читаемым на фоне. Минимум AA — 4.5:1 для обычного текста, 3:1 для крупного (18px+).
Обычный текст (14px) — пример строки для проверки контрастности.
Крупный текст (18px+ bold) — заголовок.
H2-заголовок (24px)
Коэффициент контрастности
AA обычный (≥ 4.5)
AAA обычный (≥ 7.0)
AA крупный (≥ 3.0)
AAA крупный (≥ 4.5)
О сервисе
Проверяет коэффициент контраста между цветом текста и фона по стандарту WCAG 2.1. Показывает соответствие уровням AA и AAA для обычного и крупного текста.
Что умеет
- Расчёт коэффициента контрастности (от 1:1 до 21:1)
- 4 проверки: AA/AAA для обычного и крупного текста
- Живой превью с заданными цветами
- Color picker и HEX-поле для каждого цвета
- Цветовая индикация результата (зелёный/красный)
Как работает
Формула relative luminance из WCAG 2.1: L = 0.2126·R + 0.7152·G + 0.0722·B (после линеаризации). Контраст = (L1 + 0.05) / (L2 + 0.05).
Пример
Тёмно-серый #1e293b на белом #ffffff даёт 14.5:1 — проходит даже AAA. Светло-серый #94a3b8 на белом — только 2.8:1, не проходит даже AA.
Нужен подобный сервис для вашего сайта или сложный сценарий — пишите, разработаю под задачи.
