Контраст ≥4:1
Контраст QR-кода — математическое соотношение яркости тёмных модулей и светлого фона: (L1 + 0.05) / (L2 + 0.05). Минимум для надёжного сканирования — 4:1, рекомендуется 7:1+. Чёрный на белом даёт 21:1 — физический максимум.
Что такое контраст для QR-кода
Сканер не видит цвет — он видит разницу яркостей. Пока тёмные модули достаточно отличаются от светлого фона, декодер читает матрицу независимо от конкретных оттенков. ISO/IEC 18004 формально требует коэффициент отражения 40%, но реальный мир — искусственный свет, угол 25°, потрёпанная печать — диктует другое: практический минимум — 4:1. Именно это значение выбрала практика: большинство сканеров надёжно читают QR-код при 4:1, а ниже начинаются отказы на старых Android и в плохих условиях.
Формула и расчёт
Контраст по WCAG: (L1 + 0.05) / (L2 + 0.05), где L1 — яркость светлого, L2 — тёмного. Значение L рассчитывается из RGB через гамма-коррекцию sRGB и взвешенную сумму каналов: L = 0.2126·R + 0.7152·G + 0.0722·B (в линейном пространстве). Вручную не нужно — WebAIM Contrast Checker или плагин Contrast в Figma даёт результат по двум HEX-кодам мгновенно.
Пример. Тёмно-синий #1E3A8A на белом #FFFFFF: L белого = 1.0, L синего ≈ 0.069. Контраст = (1.05) / (0.119) ≈ 8.8:1 — выше минимума с запасом. Модули с яркостью Y < 30% (L < 0.09) и фон Y > 70% (L > 0.49) гарантируют минимум 5:1.
Таблица: цвет/фон и реальный контраст
| Модули | Фон | Контраст | Результат |
|---|---|---|---|
| Чёрный #000000 | Белый #FFFFFF | 21:1 | Идеал — любой сканер, любой угол |
| Тёмно-синий #1E3A8A | Белый #FFFFFF | 8.8:1 | Надёжно — работает на старых Android |
| Бордовый #7F1D1D | Бежевый #FEF9EF | 9.4:1 | Надёжно — ресторан, крафт, lifestyle |
| Красный #E53935 | Белый #FFFFFF | 4.0:1 | На грани — при печати часто проваливается |
| Серый #9CA3AF | Белый #FFFFFF | 2.3:1 | Ниже порога — нестабильно |
| Оранжевый #F97316 | Белый #FFFFFF | 3.0:1 | Не работает — только AI-камеры последних лет |
Частые вопросы
Каков минимальный контраст для надёжного сканирования QR?
Практический минимум — 4:1: при этом значении код читается большинством современных смартфонов в нормальном освещении. Безопасная норма — 5:1, уверенная — 7:1+. Чёрный на белом даёт 21:1 и работает без исключений: любой угол, любой свет, любое устройство. При контрасте ниже 3:1 код не сканируется даже новыми камерами — только единичные модели с аппаратным ИИ могут справиться.
Как проверить контраст цветного QR онлайн?
WebAIM Contrast Checker — самый простой способ: вводите HEX цвет модулей и фон, получаете соотношение и пометку Pass/Fail по WCAG. Альтернативы: плагин Contrast для Figma, раздел Accessibility в Lighthouse (Chrome DevTools), Color Contrast Analyzer от TPGi (десктопный). В генераторе QR QRkoder контраст проверяется автоматически при выборе кастомных цветов.
Почему QR работает на экране, но не читается в печати?
RGB-цвета при конвертации в CMYK теряют яркость: насыщенный красный #DC2626 на экране даёт контраст 4.0:1, а офсетной печатью — уже 3.2:1, ниже порога. Плюс JPEG-артефакты при низком DPI размывают края модулей, а подрезка флаера может съесть тихую зону. Решение: проверяйте печатный оттиск до тиража и берите запас контраста 5:1+ для печатных материалов.
Чем отличается контраст WCAG 4.5:1 от порога QR 4:1?
WCAG 2.1 устанавливает 4.5:1 для текста нормального размера — это требование доступности для людей с ослабленным зрением. Для QR-кодов WCAG не применяется напрямую, но значение 4:1 закрепилось как практический минимум через опыт сканирования: именно при 4:1 большинство алгоритмов бинаризации стабильно разделяют модули и фон. Используйте WCAG-инструменты — они подходят и для проверки поисковых меток QR.
Влияет ли инверсия (светлые модули на тёмном) на контраст?
Математически нет: формула симметрична, белый на чёрном и чёрный на белом оба дают 21:1. Но алгоритмически — да: большинство декодеров ориентированы на «тёмные модули, светлый фон». Инверсию читают iOS 14+ и Android 12+, но старые устройства и банковские сканеры часто не распознают. При инвертированном QR повышайте уровень коррекции ошибок до H и тестируйте на 7+ устройствах.
Как сохранить фирменный цвет и пройти порог контраста?
Почти у каждого бренда есть несколько оттенков основного цвета. Берите самый тёмный из палитры — он с наибольшей вероятностью пройдёт 4:1 на белом фоне. Яркий «фирменный красный» (#E53935) не проходит, а тёмно-бордовый (#7F1D1D) того же бренда — даёт 9.4:1. Проверьте оба на WebAIM и выберите рабочий вариант. Если логотип встроен в QR — добавьте ещё запас 1–2 пункта контраста.