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

Проверяйте соотношения контраста цветов для соответствия WCAG

Ввод цветов

Настройки текста

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

Примеры цветовых пар

Предпросмотр

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

The quick brown fox jumps over the lazy dog.

О стандартах WCAG

Уровни соответствия

  • Уровень A - минимальный уровень
  • Уровень AA - рекомендуемый стандарт
  • Уровень AAA - повышенный стандарт
  • • Большинство сайтов стремятся к уровню AA

Требования к контрасту

  • Обычный текст: 4.5:1 (AA), 7:1 (AAA)
  • Крупный текст: 3:1 (AA), 4.5:1 (AAA)
  • UI элементы: 3:1 (AA)
  • • Крупный текст: 18px+ или 14px+ bold

Почему это важно

  • • Доступность для слабовидящих
  • • Читаемость при ярком освещении
  • • Снижение нагрузки на глаза
  • • Юридические требования

Часто задаваемые вопросы

PixelTool - Инструменты Разработчика