Скопировано!
Пример текста
Так выглядит текст с текущим контрастом
--:1 --
...
Цвет Фона
HEX
RGB
HSL
Цвет Текста
HEX
RGB
HSL
Калькулятор контрастности цветов (WCAG Checker)
Анализ контраста: Текст #FFFFFF на фоне #FFFFFF
Анализируем уровень читаемости текста цвета #FFFFFF на фоне #FFFFFF. Вот подробный отчет доступности (Accessibility):
Пример Текста
The quick brown fox jumps over the lazy dog.
Вердикт: К сожалению, контрастность не дотягивает до базовой нормы. Такой текст создаст проблемы для пользователей. Рекомендуем сделать текст темнее, а фон — светлее, чтобы повысить читабельность.
Детальный отчет по стандартам (WCAG 2.1)
Глобальный стандарт Web Content Accessibility Guidelines (WCAG) устанавливает жесткие правила для веб-интерфейсов.
Обычный текст (~16px)
Требуется ratio ≥ 4.5
Требуется ratio ≥ 4.5
✕ FAIL
Обычный текст (Строгий)
Требуется ratio ≥ 7.0
Требуется ratio ≥ 7.0
✕ FAIL
Крупный текст (от 24px)
Требуется ratio ≥ 3.0
Требуется ratio ≥ 3.0
✕ FAIL
Крупный текст (Строгий)
Требуется ratio ≥ 4.5
Требуется ratio ≥ 4.5
✕ FAIL
ℹ️ Для справки: Уровень AA — это минимальный стандарт, требуемый законом в большинстве стран. Уровень AAA — золотой стандарт для специализированных сайтов (гос. органы, медицина).
Сравнить с другими фонами
Посмотрите, как текст цвета #FFFFFF выглядит на популярных базовых оттенках:
Подобрать другой цвет текста
Альтернативные цвета шрифта для текущего фона #FFFFFF: