Проверка контраста — WCAG калькулятор
Проверяй контрастность цветов текста и фона для соответствия стандартам доступности WCAG
Контрастное соотношение
Превью текста
Заголовок
Обычный текст
Жирный текст
Похожие инструменты
Откройте для себя другие полезные инструменты для работы с цветами
Полная инструкция по использованию инструмента проверки контраста
Инструмент проверки контраста позволяет проверить соответствие сочетания цветов текста и фона стандартам доступности WCAG. Это важно для обеспечения читаемости контента для всех пользователей, включая людей с нарушениями зрения.
Шаг 1: Введите цвет текста
Введите цвет текста в любом формате: HEX (#000000), RGB (rgb(0,0,0)) или HSL (hsl(0,0%,0%)). Инструмент автоматически распознает формат и конвертирует его.
Шаг 2: Введите цвет фона
Введите цвет фона в том же формате. Инструмент автоматически вычислит контрастное соотношение между цветами.
Шаг 3: Проверьте результаты WCAG
Инструмент покажет контрастное соотношение и статус соответствия для уровней AA и AAA, как для обычного, так и для крупного текста.
Как использовать инструмент проверки контраста
Как проверить контраст цветов
Введите цвет текста и цвет фона в любом формате (HEX, RGB, HSL). Инструмент автоматически вычислит контрастное соотношение и покажет соответствие стандартам WCAG.
Как достичь уровня WCAG AA
Для обычного текста требуется контрастное соотношение минимум 4.5:1, для крупного текста (18pt+) — 3:1. Используйте инструмент для подбора подходящих цветов.
Как достичь уровня WCAG AAA
Для обычного текста требуется контрастное соотношение минимум 7:1, для крупного текста — 4.5:1. Это обеспечивает максимальную доступность.
Часто задаваемые вопросы о проверке контраста
Что такое контрастное соотношение?
Контрастное соотношение — это числовое значение, показывающее разницу в яркости между цветом текста и цветом фона. Оно вычисляется по формуле WCAG на основе относительной яркости цветов.
Какие форматы цветов поддерживаются?
Инструмент поддерживает HEX (#ffffff), RGB (rgb(255,255,255)) и HSL (hsl(0,0%,100%)) форматы. Автоматически распознает и конвертирует любой формат.
Что означают уровни AA и AAA?
AA и AAA — это уровни соответствия стандартам WCAG. AA — минимальный уровень доступности, AAA — расширенный уровень с более строгими требованиями к контрастности.