Проверка контраста WCAG
Скопировано!
Пример текста
Так выглядит текст с текущим контрастом
--:1 --
...
Цвет Фона
HEX
RGB
HSL
Цвет Текста
HEX
RGB
HSL

Калькулятор контрастности цветов (WCAG Checker)

Анализ контраста: Текст #60A5FA на фоне #F3F4F6

Проверяем уровень читаемости текста цвета #60A5FA на фоне #F3F4F6. Взгляните на результаты теста:

Пример Текста
The quick brown fox jumps over the lazy dog.
Коэффициент (Ratio)
2.31 : 1
Итоговая оценка
Плохо (Fail)

Вердикт: Увы, контрастность слишком слабая. Такой текст вызовет проблемы с доступностью. Советуем сделать текст темнее, а фон — светлее, чтобы повысить читабельность.

Детальный отчет по стандартам (WCAG 2.1)

Проверка пройдена по следующим параметрам:

Обычный текст (~16px)
Требуется ratio ≥ 4.5
✕ FAIL
Обычный текст (Строгий)
Требуется ratio ≥ 7.0
✕ FAIL
Крупный текст (от 24px)
Требуется ratio ≥ 3.0
✕ FAIL
Крупный текст (Строгий)
Требуется ratio ≥ 4.5
✕ FAIL
ℹ️ Для справки: Уровень AA — это минимальный стандарт, требуемый законом в большинстве стран. Уровень AAA — золотой стандарт для специализированных сайтов (гос. органы, медицина).

Сравнить с другими фонами

Посмотрите, как текст цвета #60A5FA выглядит на популярных базовых оттенках:

Подобрать другой цвет текста

Альтернативные цвета шрифта для текущего фона #F3F4F6:

Calculators