Генератор раздельно-дополнительных цветов
Создайте раздельно-дополнительную цветовую схему на основе одного исходного цвета с помощью этого генератора раздельно-дополнительных цветов. Введите 3- или 6-значный HEX-код, и инструмент вернет исходный цвет и два оттенка, расположенных на расстоянии 150 и 210 градусов по цветовому кругу HSL по обе стороны от дополнительного цвета, в виде HEX-кодов. Подходит дизайнерам и разработчикам, которым нужен сильный контраст с меньшим напряжением, чем у обычной пары дополнительных цветов.
Часто задаваемые вопросы
Что возвращает генератор раздельно-дополнительных цветов?
Он возвращает три цвета в виде шестизначных строчных HEX-кодов. Цвет 1 — исходный, цвет 2 — оттенок, повернутый на 150 градусов, а цвет 3 — оттенок, повернутый на 210 градусов.
Что такое раздельно-дополнительная схема?
Вместо единственного цвета, противоположного исходному, используются два цвета по соседству с ним — на расстоянии 30 градусов по обе стороны. Сохраняется большая часть контраста пары дополнительных цветов, но палитру проще сбалансировать.
Как выполняется расчет?
Инструмент преобразует HEX-код в HSL, прибавляет к оттенку 150 и 210 градусов и выполняет переход через границу в пределах 360 градусов. Насыщенность и светлота остаются прежними, а каждый результат преобразуется обратно в HEX-код.
Какие раздельно-дополнительные цвета соответствуют чистому красному?
Для #ff0000 инструмент возвращает #ff0000, #00ff80 и #0080ff: весенний зеленый и лазурный по обе стороны от голубого. Инструмент использует экранный цветовой круг HSL, поэтому результат отличается от цветового круга художников с красным, желтым и синим.
Какие форматы цветов можно вводить?
Введите один HEX-код из 3 или 6 цифр, с символом # или без него, например #3366cc или 36c. Строки RGB и HSL, а также названия цветов не поддерживаются, поэтому сначала преобразуйте их в HEX.
Почему исходный цвет немного отличается в результате?
Значения оттенка, насыщенности и светлоты округляются до целых чисел, поэтому при преобразовании вашего цвета в HSL и обратно значение одного канала может измениться на единицу. Например, #ff5733 преобразуется обратно в #ff5833, а рядом с ним располагаются #33ffbe и #3374ff.
Как использовать раздельно-дополнительную палитру?
Используйте исходный цвет как основной, а два раздельно-дополнительных цвета — как акценты для второстепенных действий, выделений или рядов диаграммы. Поскольку акценты не являются точными противоположностями исходного цвета, они меньше конфликтуют с ним, чем прямой дополнительный цвет.
Что происходит с черным, белым и серым цветами?
У нейтральных цветов нулевая насыщенность, поэтому любой поворот оттенка возвращает тот же серый цвет. Выберите исходный цвет с некоторой насыщенностью, чтобы получить три разных цвета.
Проверяет ли инструмент контраст текста?
Нет, он только вычисляет цвета. Все три имеют ту же светлоту, что и базовый цвет, поэтому перед публикацией проверьте контраст любой комбинации текста и фона с помощью инструмента проверки контрастности.
Совпадает ли результат с генератором цветовой палитры?
Да. Этот инструмент выполняет те же вычисления, что и параметр «Раздельно-дополнительная схема» в генераторе цветовой палитры, поэтому для одного базового цвета оба инструмента выдают одинаковые HEX-коды.