Перейти до вмісту

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

Виміряйте контраст двох кольорів за WCAG 2.2, подивіться, які вимоги пара задовольняє, і отримайте найближчий відтінок, що сягає тієї, якої бракує.

Безкоштовно Без реєстрації Приватність передусім

HEX, rgb(), hsl(), hwb(), oklch(), oklab(), lab(), lch(), color(display-p3 ...) або назва кольору в CSS.

Нещодавні

Контраст

APCA (чернетка, додаткова інформація)

APCA - це перцептивна модель контрасту, укладена для WCAG 3. Сьогодні вона не є вимогою відповідності й розходиться з WCAG 2 в обидва боки, тож показана як додаткова інформація і ніколи як зараховано чи незараховано.

Як це виглядає

Кожне перетворення, кожна палітра й кожне значення контрасту на цій сторінці обчислюються у вашому браузері. Зображення, яке ви сюди перетягнете, читається на полотні в цій вкладці й ніколи не надсилається на сервер.

Як це працює

Що означає це співвідношення

Співвідношення обчислюється за визначенням WCAG 2.2: відносна яскравість світлішого кольору плюс 0,05, поділена на те саме для темнішого. 4,5:1 - вимога AA для звичайного тексту, 3:1 - для великого тексту й елементів інтерфейсу, а 7:1 - це AAA. Напівпрозорий колір спершу накладається на колір сторінки так, як його малює браузер.

Коли пара не сягає цілі, пропозицією є найближчий відтінок того самого кольору, який її досягає, - знайдений за світлістю й хромою в OKLCH і виміряний повторно після округлення до восьми бітів, тож скопійований запис справді проходить. Виконання вимоги до контрасту - це один критерій успіху з багатьох, і саме собою воно не робить сторінку доступною.

Створюйте кращий вебпростір, швидше.

Ми створюємо індивідуальне програмне забезпечення та рішення, адаптовані до ваших потреб.

Зв'язатися