Проверьте свои цвета
Проверьте цветовые комбинации, чтобы убедиться, что они соответствуют стандартам доступности WCAG для читаемости текста.
Обычный текст
Крупный текст
Быстрые исправления
Быстрая коричневая лиса перепрыгивает через ленивую собаку
Пример маленького текста (12px)
Стандарты WCAG
Уровень AA
Минимальный коэффициент контраста 4.5:1 для обычного текста и 3:1 для крупного текста. Требуется для большинства веб-сайтов.
Уровень AAA
Улучшенный коэффициент контраста 7:1 для обычного текста и 4.5:1 для крупного текста. Рекомендуется для оптимальной доступности.
Недостаточная контрастность для всех размеров текста - не соответствует стандартам WCAG.
Проверка контраста цветов
Рассчитайте коэффициент контраста текста и фона.
Выберите цвет с помощью селектора цвета для текста и фона или введите цвет в формате RGB шестнадцатеричного кода (например, #259 или #2596BE). Вы можете настроить ползунок для выбора цвета. Руководство по доступности веб-контента (WCAG) содержит конкретные рекомендации, чтобы определить, читаем ли текст для зрячих пользователей. Этот критерий использует определенный алгоритм для сопоставления цветовых комбинаций с сопоставимыми коэффициентами. Согласно этой формуле, WCAG утверждает, что коэффициент контраста 4.5:1 между текстом и его фоном является достаточным для обычного текста, а для крупного текста (18+ pt обычный или 14+ pt жирный) должен быть как минимум 3:1.
Ключевые особенности
- Расчет контрастности в реальном времени
- Проверка соответствия WCAG AA и AAA
- Ползунки HSL для точной настройки
- Несколько форматов предпросмотра
Расширенные инструменты
- Автоматическая коррекция цвета
- Образцы текста и фона
- Определение названия цвета
- Экспорт результатов