Генератор монохроматической палитры
Создайте монохроматическую палитру на основе одного цвета с помощью этого генератора монохроматической палитры. Введите 3- или 6-значный HEX-код, и инструмент сохранит его тон и насыщенность, изменив светлоту на 30 и 15 пунктов в каждом направлении в диапазоне от 10 до 90 процентов. В результате вы получите пять оттенков и тонов в виде HEX-кодов, а базовый цвет будет посередине. Идеально подходит дизайнерам и разработчикам, создающим спокойные, согласованные цветовые шкалы и темы UI.
Часто задаваемые вопросы
Что возвращает генератор монохроматической палитры?
Он возвращает пять цветов в виде шестизначных строчных HEX-кодов. Цвет 3 — базовый, цвета 1 и 2 — более темные версии, а цвета 4 и 5 — более светлые версии того же оттенка.
Как вычисляются оттенки?
Инструмент преобразует ваш HEX-код в HSL и меняет только светлоту: минус 30, минус 15, плюс 15 и плюс 30 процентных пунктов. Тон и насыщенность остаются прежними, поэтому все пять цветов принадлежат одной цветовой гамме.
Есть ли нижний или верхний предел светлоты?
Да. При затемнении светлота не опускается ниже 10 процентов, а при осветлении не поднимается выше 90 процентов, поэтому шкала не содержит чистого черного и чистого белого.
Почему для очень темных или светлых базовых цветов появляются дубликаты или неожиданные цвета?
Из-за ограничений в 10 и 90 процентов соседние шаги у границ шкалы совпадают. Для #000000 оба шага затемнения дают значение #1a1a1a, которое светлее базового цвета, а для #ffffff оба шага осветления дают #e6e6e6.
Какую палитру дает чистый красный?
Для #ff0000 инструмент возвращает #660000, #b30000, #ff0000, #ff4d4d и #ff9999. Красный имеет светлоту 50 процентов, поэтому для него доступны два полных шага затемнения и два осветления.
Какие форматы цветов можно вводить?
Введите один 3- или 6-значный HEX-код, с символом # или без него, например #3366cc или 36c. Форматы RGB и HSL, а также названия цветов не поддерживаются, поэтому сначала преобразуйте их в HEX.
Почему базовый цвет немного меняется в результате?
Тон, насыщенность и светлота округляются до целых чисел, поэтому преобразование в HSL и обратно может изменить один из каналов на единицу. Например, #ff5733 отображается как #ff5833 в середине шкалы.
Подходит ли инструмент для серых цветов?
Да. В отличие от схем, основанных на тоне, монохроматическая шкала меняет светлоту, поэтому серый цвет дает более светлые и темные оттенки серого. Черный и белый ограничены упомянутым выше диапазоном от 10 до 90 процентов.
Как использовать монохроматическую палитру в интерфейсе?
Используйте самые темные цвета для текста и границ, базовый цвет — для основных действий, а самые светлые — для фонов и состояний при наведении. Проверьте контраст текста с помощью средства проверки контрастности WCAG, поскольку соседние шаги различаются по светлоте всего на 15 пунктов.
Совпадает ли результат с результатом генератора цветовых палитр?
Да. Этот инструмент выполняет те же вычисления, что и параметр «Монохроматическая схема» в генераторе цветовой палитры, поэтому для одного базового цвета оба инструмента выдают одинаковые пять HEX-кодов.