Перейти до основного вмісту
Labs // COLOR CONTRAST CHECKER

Перевірка контрасту кольорів

Перевіряй контраст кольорів для доступності. Отримуй індикатори відповідності WCAG та пропозиції щодо покращення.

Коефіцієнт контрасту: 21.00:1
Perfect contrast

Звичайний текст (14px+)

WCAG AA
Пройдено
WCAG AAA
Пройдено

Великий текст (18px+)

WCAG AA
Пройдено
WCAG AAA
Пройдено

Попередній перегляд

Large Heading Text
Medium Heading Text
Normal body text. This is how your content will look with these colors. Make sure the contrast is sufficient for readability.
Small text example with current color combination.

Найкращі практики

  • Прагни до мінімальних стандартів WCAG AA (4.5:1 для звичайного тексту)
  • WCAG AAA (7:1) для кращої доступності
  • Тестуй з різними фонами та умовами освітлення
  • Враховуй різні вади зору
  • Не покладайся виключно на колір для передачі інформації

Актуальність для

  • Дизайн веб-сайтів та типографіка
  • Мобільні додатки та користувацькі інтерфейси
  • Друкований дизайн та маркетингові матеріали
  • Перевірки відповідності доступності
  • Бренд-гайдлайни та системи дизайну
Перевірка контрасту кольорів | Pixel & Process | Pixel & Process