Проверка контрастности
Выберите цвета текста и фона, чтобы проверить коэффициент контрастности по требованиям WCAG AA и AAA. Просмотрите отдельные результаты для обычного и крупного текста и предварительный просмотр выбранных цветов.
Возможности
Проверка коэффициента для двух цветов
Выберите цвета текста и фона и просмотрите коэффициент контрастности с точностью до двух знаков после запятой.
Сравнение порогов AA и AAA
Просмотр отдельных результатов для обычного и крупного текста с предварительным просмотром выбранных цветов.
Сравнение с чёрным и белым
Откройте дополнительные сведения, чтобы сравнить цвет текста с чёрным и белым фоном.
Как пользоваться
Введите цвет текста
Выберите HEX, RGB, HSL, HSV или CMYK и введите цвет текста. При выборе цвета переключается формат ввода HEX.
Выберите цвет фона
Введите HEX из 3 или 6 цифр либо выберите цвет. Символ # в начале необязателен.
Проверьте контрастность
Нажмите «Проверить контрастность», чтобы просмотреть коэффициент, пример текста и результаты AA/AAA. После изменения любого цвета выполните проверку снова.
Когда пригодится
Проверка основного текста на фоне
Введите цвета страницы и проверьте, соответствует ли обычный текст заданному коэффициенту.
Сравнение цветов заголовков
Используйте результат для крупного текста и предварительный просмотр при подборе цветов заголовка.
Как читать результаты
Коэффициенты AA и AAA
Для AA коэффициент должен быть не ниже 4,5:1 для обычного текста и 3:1 для крупного. Для AAA — 7:1 для обычного и 4,5:1 для крупного текста. При проверке используется неокруглённый коэффициент.
Что считается крупным текстом
Крупный текст — не менее 18 пт или 14 пт полужирным. В CSS это 24 пикселя или около 18,7 пикселя полужирным. В предварительном просмотре используется обычный текст размером 16 и 24 пикселя.
Область проверки
Проверяется контрастность текста между двумя непрозрачными цветами sRGB. Фоновые изображения, смешение альфа-каналов, нетекстовые элементы и соответствие всей страницы не оцениваются.
Вопросы и ответы
Означает ли соответствие коэффициента, что вся страница отвечает требованиям?
Результат относится только к контрастности текста для двух выбранных цветов. Соответствие требованиям всей страницы оценивается отдельно.
Что показывает сравнение с чёрным и белым?
Цвет текста сравнивается с чёрным и белым фоном, затем показывается, где коэффициент выше. Это отдельный результат, не связанный с выбранным фоном.
Можно ли проверить прозрачный текст или текст на изображении?
Альфа-канал и фоновые изображения не поддерживаются. Введите непрозрачные цвета текста и фона.
Ввод и вывод
- Цвет текста
- Значения HEX, RGB, HSL, HSV или CMYK либо выбор цвета. CMYK — приблизительная оценка без ICC-профиля.
- Фон
- HEX из 3 или 6 цифр либо выбор цвета. Альфа-канал не поддерживается.
- Результат
- Коэффициент контрастности, результаты AA/AAA для обычного и крупного текста и предварительный просмотр текста. Результаты отображаются без функции сохранения.