# Генератор дополнительного цвета

Найдите дополнительный цвет для любого базового цвета с помощью этого генератора. Введите 3- или 6-значный HEX-код: инструмент повернет его оттенок на 180 градусов на цветовом круге HSL, сохранив насыщенность и светлоту, а затем вернет базовый цвет и его дополнение в виде HEX-кодов. Идеально для дизайнеров и разработчиков, которым нужен контрастный акцент для кнопок, выделений, диаграмм и фирменной графики.

## Часто задаваемые вопросы

### Что возвращает генератор дополнительных цветов?

Он возвращает два цвета в виде шестизначных строчных HEX-кодов. Цвет 1 — это базовый цвет, а цвет 2 — его дополнение, то есть цвет, расположенный напротив него на цветовом круге.

### Как рассчитывается дополнительный цвет?

Инструмент преобразует ваш HEX-код в HSL, добавляет 180 градусов к оттенку и сохраняет насыщенность и светлоту без изменений. Полученное значение преобразуется обратно в RGB и записывается в виде HEX-кода, поэтому дополнительный цвет имеет ту же яркость и насыщенность, что и базовый.

### Какие форматы цветов можно вводить?

Введите 3- или 6-значный HEX-код с начальным символом # или без него, в верхнем или нижнем регистре, например #ff5733, FF5733 или #f00. Запись RGB и HSL, а также названия цветов не принимаются: сначала преобразуйте их в HEX с помощью конвертера цветов.

### Почему цвет 1 немного отличается от введенного мной HEX-кода?

Базовый цвет преобразуется в HSL с целочисленными значениями оттенка, насыщенности и светлоты, а затем обратно в HEX, поэтому один из каналов может измениться на один шаг. Например, #ff5733 преобразуется обратно в #ff5833, а его дополнительный цвет — #33daff.

### Какой цвет дополняет чистый красный?

Дополнительный цвет для #ff0000 — #00ffff, циан. Этот инструмент использует цветовой круг RGB, основанный на HSL и предназначенный для экранов: красный сочетается с цианом, а не с зеленым, как на традиционном круге художников.

### Что происходит с черным, белым и серым цветами?

Нейтральные цвета имеют нулевую насыщенность, поэтому поворот оттенка ничего не меняет, и оба результата представляют собой один и тот же серый цвет. Если вам нужен заметный дополнительный цвет, выберите базовый цвет с некоторой насыщенностью.

### Как использовать пару дополнительных цветов в дизайне?

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

### Проверяет ли инструмент контрастность текста?

Нет, он только вычисляет пару цветов. Дополнительный цвет сохраняет светлоту базового, поэтому у двух цветов может быть схожая яркость и недостаточная контрастность для текста. Перед тем как размещать один цвет на другом, проверьте их с помощью средства проверки контрастности WCAG.

### Можно ли ввести несколько цветов сразу?

Нет, за один запуск принимается ровно один HEX-код. Ввод с несколькими строками или дополнительным текстом отклоняется с сообщением об ошибке, поэтому запускайте инструмент отдельно для каждого базового цвета.

### Совпадает ли результат с результатом генератора цветовых палитр?

Да. Этот инструмент выполняет тот же расчет, что и параметр «Дополнительный» в генераторе цветовых палитр, поэтому для одного и того же базового цвета оба инструмента всегда возвращают одинаковые два HEX-кода.

Ваша реклама здесь?

[Напишите нам по электронной почте](mailto:hi@dennn.is?subject=%D0%A0%D0%B5%D0%BA%D0%BB%D0%B0%D0%BC%D0%B0%20%D0%BD%D0%B0%20OneClick%20Pro)

[Реклама Набор плагинов для работы агентов с WordPress.](https://sleekwp.com/?ref=oneclickpro)