ImageColorPicker.com

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

Перевірте коефіцієнт контрастності між кольорами переднього плану та фону, щоб забезпечити доступність.

1.00:1
Контраст
Fail
Дуже погано

Звичайний текст

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

Великий текст

AA (3:1)
✖
AAA (4.5:1)
✖
#FFFFFF
#ffffff
#546E7A
#546e7a

Швидкі виправлення

Aa

Заголовок попереднього перегляду

Швидка руда лисиця стрибає через ледачого собаку

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

Текст
#ffffff
Фон
#546e7a

Стандарти 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+ пунктів звичайний, або 14+ пунктів жирний) повинен мати щонайменше 3:1 коефіцієнт контрастності.

Ключові особливості

  • • Розрахунок коефіцієнта контрасту в реальному часі
  • • Перевірка відповідності WCAG AA & AAA
  • • Повзунки HSL для точного налаштування
  • • Кілька форматів попереднього перегляду

Розширені інструменти

  • • Автоматичне виправлення кольору
  • • Зразки тексту та фону
  • • Визначення назви кольору
  • • Експорт результатів