Генератор дополнительных цветов
Создайте пару дополнительных цветов: введите базовый цвет в HEX, RGB, HSV или HSL, получите противоположный оттенок по HSL. Пример: #FF0000 → #00FFFF. Обрабо…
Начать работу
Возможности и ограничения
Инструмент «Дополнительные цвета» помогает быстро найти контрастный акцент для вашего дизайна. Он использует цветовую модель HSL: тон базового цвета поворачивается на 180 градусов, чтобы получить противоположный цвет. Например, для базового цвета #FF0000 (красный) дополнительным будет #00FFFF (голубой).
Как это работает
Вы задаёте базовый цвет в одном из поддерживаемых форматов: HEX, RGB, HSV или HSL. Инструмент преобразует его в HSL, изменяет тон на 180 градусов, а затем преобразует обратно в RGB и HEX. При этом насыщенность и светлота дополнительного цвета округляются до целых чисел, поэтому итоговый HEX может незначительно отличаться от точного математического расчёта.
Практическое применение
Дополнительные цвета часто используются для создания акцентов в интерфейсах, логотипах или иллюстрациях. Например, если ваш основной цвет — синий (#3B82F6), дополнительный будет оранжевым (#F6B83B). Это помогает выделить важные элементы, такие как кнопки или ссылки.
Ограничения
- Противоположный оттенок не гарантирует достаточного контраста для текста или доступности. Проверяйте контрастность отдельно.
- Инструмент не учитывает воспринимаемую яркость или цветовые слепоты.
- Ручное изменение одного из цветов после генерации нарушает свойство дополнительности.
- Все вычисления выполняются локально в вашем браузере, без загрузки данных на сервер.
Часто задаваемые вопросы
Почему дополнительный цвет для #FF0000 — #00FFFF, а не #00FF00?
Инструмент использует цветовую модель HSL, где дополнительный цвет определяется поворотом тона на 180 градусов. Для красного (тон 0°) это даёт тон 180°, который соответствует голубому (#00FFFF). В модели RGB (где дополнительный цвет вычисляется как 255 минус каждая компонента) дополнительным был бы зелёный (#00FF00), но этот инструмент работает именно по HSL.
Могу ли я ввести цвет в формате RGB или HSV?
Да, в расширенной панели базового цвета вы можете переключиться на формат RGB, HSV или HSL и ввести значения в соответствующих полях. После расчёта результат будет показан в HEX.
Что произойдёт, если я изменю один из полученных цветов?
Вы можете кликнуть на образец цвета и отредактировать его. Однако после этого пара цветов больше не будет гарантированно дополнительной, так как второй цвет останется прежним. Инструмент не пересчитывает автоматически противоположный цвет для изменённого.
Обработка выполняется локально в вашем браузере.