Пороги контрастности WCAG AA
Formula
Обычный текст: 4,5:1; крупный текст (жирный шрифт ≥18 пт или 14 пт): 3:1; Компоненты пользовательского интерфейса: 3:1.
Variables
- Р, Г, Б
- Каналы sRGB (нормализованные 0–255 или 0–1)
- Ч, С, Л
- Оттенок (градусы), насыщенность и яркость (0–1) в HSL.
- л
- Относительная яркость (WCAG) или яркость в HSL/OKLCH
FAQ
- Точны ли пороговые значения контрастности WCAG AA для рабочих процессов печати?
- Экран RGB и печатный CMYK используют разные гаммы. Относитесь к конверсиям как к приблизительным доказательствам; калибровать с помощью профилей ICC для коммерческой печати.
- Могу ли я использовать эту формулу в CSS?
- Современный CSS поддерживает функции color-mix(), oklch() и lab() для многих операций. Для сложных конвейеров выполните вычисления в JavaScript и экспортируйте переменные CSS.
- Загружает ли Color DevByte мои цвета?
- Нет. Справочные страницы формул являются статической документацией; интерактивные инструменты работают на 100% на стороне клиента вашего браузера.
Обзор
Минимальный коэффициент контрастности для соответствия уровню AA.
Color DevByte документирует эту формулу для разработчиков, дизайнеров и специалистов по обеспечению доступности, которым нужна воспроизводимая цветовая математика без отправки данных на сервер.
Используйте связанные инструменты цвета, чтобы применить эту формулу в интерактивном режиме с предварительным просмотром в реальном времени и многоформатным экспортом.
Когда использовать эту формулу
Применяйте пороговые значения контраста wcag aa при создании токенов дизайна, проверке контрастности WCAG или автоматизации конвейеров цвета в CSS, Tailwind или JSON системы дизайна.
Для производственного пользовательского интерфейса всегда проверяйте результаты с помощью средства проверки контрастности или визуального предварительного просмотра — крайние случаи гамма-коррекции и сопоставления гаммы могут изменить результаты.
Замечания по реализации
Браузерные инструменты должны линеаризировать sRGB перед расчетом яркости или ΔE.
Предпочитайте интерполяцию OKLCH или LAB для градиентов и тем, чтобы избежать сероватых средних точек, характерных для смесей RGB.