Проверка контраста цвета

    Проверьте коэффициент контраста между передним и фоновым цветами для обеспечения доступности.

    1.00:1
    Контраст
    Fail
    Очень плохо

    Обычный текст

    AA (4.5:1)
    AAA (7:1)

    Крупный текст

    AA (3:1)
    AAA (4.5:1)
    Black
    #000000
    Eastern Blue
    #2596be

    Быстрые исправления

    Aa

    Заголовок предпросмотра

    Быстрая коричневая лиса перепрыгивает через ленивую собаку

    Пример маленького текста (12px)

    Текст
    #000000
    Фон
    #2596be

    Стандарты WCAG

    Level AA

    Минимальный коэффициент контраста 4.5:1 для обычного текста и 3:1 для крупного текста. Требуется для большинства веб-сайтов.

    Level 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 для точной настройки
    • Несколько форматов предпросмотра

    Расширенные инструменты

    • Автоматическая коррекция цвета
    • Образцы текста и фона
    • Определение названия цвета
    • Экспорт результатов