цвет
Генератор оттенка цвета
Осветлите цвет, смешав его с белым.
Генератор оттенка цвета: TOEA применяет фиксированную формулу: Оттенок = цвет × (1 − количество) + белый × количество. Вычисления цвета выполняются локально в браузере. Работает на 100% локально в вашем браузере, файлы на сервер не загружаются.
- Категория
- Инструменты на каждый день
- Запуски
- В вашем браузере
- Стоимость
- Бесплатно · без регистрации
- Доступность
- Готово к использованию
HEX оттенка
#5C8AF0
- RGB оттенка
- rgb(92, 138, 240)
Оттенок = цвет × (1 − количество) + белый × количество- Результаты представляют собой детерминированные математические преобразования sRGB; отображаемый вид зависит от вашего монитора и цветового профиля.
- Ввод HEX поддерживает запись #RGB или #RRGGBB. Значения остаются в браузере и не загружаются на сервер.
Создание шкалы светлых оттенков
В дизайн-системах более светлые ступени часто получают смешиванием с белым; tint-color() в Bootstrap работает именно так. Оттенки с содержанием белого около 80–95% подходят для фонов уведомлений, выбранных строк и бейджей, а 20–40% дают более мягкую версию фирменного цвета для заливок при наведении и иллюстраций. Создавайте каждую ступень из исходного базового цвета, а не из уже осветлённого оттенка, чтобы проценты сохраняли смысл. Сам базовый цвет оставляйте для текста или значков на самых светлых ступенях.
Почему светлые оттенки могут выглядеть меловыми
Добавление белого снижает насыщенность и одновременно повышает светлоту, поэтому бледные оттенки могут выглядеть молочными, а синие особенно часто смещаются к лавандовым. Если светлая ступень выглядит неудачно, попробуйте немного более насыщенный базовый цвет или задайте светлоту напрямую в конвертере цветов и сравните результат. Тёмный текст легче проходит проверку контраста на более светлом оттенке; проверьте используемую пару в проверке контраста.
Как пользоваться
- Введите допустимое значение #RGB или #RRGGBB и нужный процент.
- Запустите фиксированную операцию с цветом локально в браузере.
- Просмотрите образцы и скопируйте результат или значения палитры.
Конфиденциальность и ограничения
Значения цветов остаются на этом устройстве. Результат проверки контрастности — это математическая проверка, а не универсальная гарантия соответствия WCAG; необходимо также проверить контекст, отображение шрифта, контраст нетекстовых элементов и состояния пользовательского интерфейса.
Похожие инструменты
Часто задаваемые вопросы
Как работает генератор оттенка?
Он использует формулу: Оттенок = цвет × (1 − количество) + белый × количество.
Какие форматы HEX поддерживаются?
Используйте трёхзначную запись #RGB или шестизначную запись #RRGGBB в формате sRGB. Альфа-каналы и именованные цвета не поддерживаются.
Гарантирует ли результат проверки контрастности соответствие требованиям доступности?
Нет. Это математическая проверка контрастности для указанных цветов и пороговых значений текста, а не универсальная гарантия соответствия требованиям.
Бесплатный инструмент · запусков: в вашем браузере · аккаунт не нужен