fiokit.

Перевірка контрасту WCAG AA та AAA

Перевіряйте контраст кольорів за WCAG 2.2 AA та AAA, переглядайте розміри тексту й знаходьте доступні альтернативи кольорів.

Наведіть вказівник на поле або виберіть його, щоб побачити довідку. Натисніть Escape, щоб закрити.

Використовуйте HEX, RGB, RGBA або HSL. Прозорі кольори накладаються на непрозоре полотно.

5.84:1

Пороги використовують співвідношення з повною точністю, а не округлене показане значення.

WCAG 2.2
РівеньЗастосуватиSCМінімумРезультат
AAЗвичайний текст1.4.34.5:1Відповідає
AAВеликий текст1.4.33:1Відповідає
AAAЗвичайний текст1.4.67:1Не відповідає
AAAВеликий текст1.4.64.5:1Відповідає
AAЕлементи інтерфейсу та графіка1.4.113:1Відповідає
Aa — fiokit.

Звичайний текст: AA ✓ · AAA ✗

Великий текст: щонайменше 24 CSS px або 18,67 CSS px жирним (14 pt).

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

W3C — SC 1.4.3 · SC 1.4.6 · SC 1.4.11

Як це працює

Задайте передній план, тло й непрозоре полотно. Результати AA та AAA оновлюються одразу. Спробуйте розмір і товщину шрифту, застосуйте запропонований колір або завантажте звіт.

Практичний приклад

Кольори

#155bdf

Поширені запитання

Чи надсилається мій текст на сервер?

Ні. Вміст обробляється в цьому браузері. Він не надсилається на сервер і не зберігається.

Що варто знати про інструмент «Перевірка контрасту WCAG AA та AAA»?

Окремо показує пороги для тексту й нетекстових елементів. Ця перевірка кольорів не підтверджує повну відповідність WCAG.