Руководство
Проверка контраста для доступности
Прежде чем палитра попадёт в продукт, Лаборатория палитр покажет, какие пары проходят контраст WCAG для текста, какие цвета трудно различить при особенностях цветового зрения и как цвета выглядят в реальном интерфейсе.
Pro Входит в ColorSnapr Pro Обновлено:
Главное
- Матрица контраста: каждая пара фон × текст с коэффициентом и результатом AA / AA для крупного текста / AAA.
- Конфликты цветового зрения: пары, которые трудно различить при протанопии, дейтеранопии или тританопии.
- Предпросмотр интерфейса: ваша палитра на кнопках, карточках и тексте.
- Плавные градиенты с интерполяцией в Oklab.
- Для каждого сохранённого цвета бесплатно показывается контраст с белым и чёрным текстом.
Как это работает
- 1 Откройте палитру и выберите «Лаборатория палитр».
- 2 Посмотрите вкладку «Доступность»: ячейки в рамке проходят AA для обычного текста.
- 3 Перейдите в «Предпросмотр» или «Градиент», подправьте цвета и проверьте снова.
Вопросы
Какие пороги WCAG используются?
4.5:1 для обычного текста (AA), 3:1 для крупного текста (AA для крупного текста) и 7:1 для AAA — по WCAG 2.
Лаборатория палитр бесплатна?
Лаборатория палитр входит в ColorSnapr Pro. Контраст с белым и чёрным текстом для каждого сохранённого цвета доступен бесплатно.
Попробуйте на своём телефоне — ColorSnapr можно скачать бесплатно.