Slopographic

Slop Colors · безкоштовно, у вашому браузері

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

Сірий текст на білому виглядає елегантно, поки його ніхто не може прочитати. Введіть два кольори, і Slop Colors покаже коефіцієнт WCAG, які рівні пройдено, і найближчий колір тексту, який проходить.

Перевірити контраст

Як це зробити

  1. Прогорніть до розділу «Перевірка контрасту (WCAG 2)» і введіть колір тексту та колір фону у форматі HEX, RGB, HSL або OKLCH.
  2. Прочитайте коефіцієнт і п’ять результатів: AA і AAA для звичайного тексту, AA і AAA для великого тексту, а також елементи інтерфейсу та графіка.
  3. Подивіться на зразок: великий текст і абзац у ваших двох кольорах.
  4. Якщо AA для звичайного тексту не проходить, натисніть «Виправити колір тексту»: колір зберігає відтінок і стає лише достатньо світлим або темним, щоб пройти перевірку.
  5. Натисніть «Поміняти», щоб перевірити кольори навпаки.

Ваші файли лишаються на цьому пристрої: Slop Colors працює у вашому браузері, без вивантаження, облікового запису й водяного знака.

Питання

Які коефіцієнти вимагає WCAG?

Рівень AA вимагає 4,5:1 для звичайного тексту і 3:1 для великого (24 px або 18,66 px жирним) та для елементів інтерфейсу й графіки. Рівень AAA вимагає 7:1 і 4,5:1.

Чому показано 4,47, а не 4,48?

Коефіцієнт округлюється вниз, як це показує перевірка WebAIM, тож пара з 4,499 ніколи не відображається як така, що проходить 4,5.

Чи може воно перевірити колір із мого екрана?

У Chrome і Edge кнопка «Вибрати з екрана» бере будь-який піксель на вашому екрані. Потім використайте його як колір тексту або фону з панелі.

Чи щось вивантажується?

Ні. Кольори перевіряє сторінка у вашому браузері; нічого нікуди не надсилається.

Більше з Slop Colors

Пов’язані застосунки

  • PhotoSlop
    Працює
    Photoshop, створений заново для браузера.
  • SlopVector
    Працює
    Illustrator, створений заново для браузера.
  • SlopIsolate
    Бета
    Видаляйте фони за допомогою ШІ, який працює на вашому пристрої.