Генератор оттенков цвета

Тёмные оттенки для состояний и текста

Оттенок цвета кнопки с добавлением 10–20% чёрного часто используют для состояния при наведении или нажатии: он достаточно тёмный, чтобы быть заметным, но не выглядит другим цветом. Более насыщенные тёмные оттенки с добавлением 60–80% чёрного превращают фирменный цвет в глубокий тон для заголовков или текста, который всё ещё воспринимается частью палитры. Именно такие ступени чаще всего проходят проверку контраста на белом фоне. Создавайте каждую ступень из исходного базового цвета, чтобы шкала оставалась равномерной.

Когда тёмные версии становятся грязными

Смешивание с чёрным одинаково уменьшает значение каждого канала. Оттенок сохраняется, но визуальное название цвета меняется: тёмный жёлтый выглядит оливковым, тёмный оранжевый — коричневым, а тёмный розовый — бордовым, хотя расчёт выполняется правильно. Если оттенок выглядит грязным, дизайнеры часто немного сдвигают его тон, например жёлтый — в сторону оранжевого, а уже затем затемняют. В микшере цветов можно затемнить цвет в сторону глубокого тёмно-синего или коричневого, а не чистого чёрного, чтобы получить более насыщенный результат.

Как пользоваться

1. Введите корректное значение в формате #RGB или #RRGGBB и нужный процент.
2. Запустите фиксированную операцию с цветом локально в браузере.
3. Просмотрите образцы и скопируйте результат или значения палитры.

Конфиденциальность и ограничения

Значения цветов остаются на этом устройстве. Результат проверки контрастности — это математическая проверка, а не гарантия соответствия WCAG во всех случаях; необходимо также учитывать контекст, отображение шрифтов, контраст нетекстовых элементов и состояния пользовательского интерфейса.