Попугай внутри цветового круга

Волшебство цветового круга: гармония цвета в веб-дизайне

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

Что такое цветовой круг

Цветовой круг удобно и понятно демонстрирует спектральные цвета в виде чередующихся секторов. Эта схема появилась еще в 18-19 веках как следствие теорий Гёте, Иттена и других ученых, и теперь помогает дизайнерам формировать гармоничные сочетания оттенков для своих работ.

Цветовой круг

Инструмент позволяет выстраивать шесть вариантов цветовой гармонии:

  1. Аналоговую;
  2. Комплементарную;
  3. Сплит-комплементарную;
  4. Триадную;
  5. Тетрадную;
  6. Аналого-комплементарную.

Рассмотрим каждое сочетание цветов более подробно.

Аналоговая

Такая гармония создается просто: нужный вам цвет сочетается либо с двумя цветами вокруг него, либо с теми двумя, что справа или слева от него.

Приведу пример. Нам интересен красно-оранжевый оттенок. Аналоговая гармония появится, если к нему добавим:

· Либо красный и оранжевый;
· Либо красный и светло-фиолетовый;
· Либо оранжевый и светло-оранжевый.

Аналоговая гармония цветового круга

Представленная гармония — самая мягкая из всех, поскольку она основана на цветах одного семейства. В нашем примере это оттенки красного и оранжевого цветов.

Комплементарная

Цвета гармонии расположены друг напротив друга. Вернемся к нашему примеру: для красно-оранжевого оттенка в комплементарной композиции подходит светло-синий цвет.

Комплементарная гармония цветового круга

Данная гармония основана на высокой контрастности оттенков, поэтому использовать ее стоит осторожно.

Сплит-комплементарная

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

Сплит-комплементарная гармония цветового круга

Сплит-комплементарное сочетание контрастно, однако не так бескомпромиссно, как комплементарное.

Триадная

Знание геометрии поможет в формировании четвертой гармонии цвета — триадной. Сочетание цветов здесь образуется с помощью равностороннего треугольника, помещенного в центр круга.

В нашем примере с красно-оранжевым цветом, триаду с ним составляют фиолетово-синий и светло-зеленый.

Триадная гармония цветового круга

Классическая триада цветового круга интересна своими сочетаниями, которые порой удивляют.

Тетрадная

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

Чтобы сформировать тетрадную гармонию с красно-оранжевым цветом по, например, прямоугольнику, нужно добавить к нему оранжевый, фиолетово-синий и светло-синий.

Тетрадная гармония цветового круга

Аналого-комплементарная

Последняя в нашем списке. Она объединила контрастность комплементарной и мягкость аналоговой гармоний. Композиция из четырех цветов формируется путем присоединения оттенков аналоговой гармонии к противоположному ей цвету.

Знакомый красно-оранжевый цвет сможет сложить прекрасную композицию с синим, светло-синим и зеленым цветами из аналоговой гармонии. И наоборот: композиция из красно-оранжевого и его соседних оттенков отлично сочетается со светло-синим.

Аналого-комплементарная гармония

Мы рассмотрели все композиции, которые предлагает цветовой круг. Теперь вам станет намного проще подбирать оттенки для ваших проектов. Однако помимо колористики сайта, стоит помнить и о контрасте по оттенку, яркости и насыщенности, чтобы создать приятное сочетание. Виды контраста цветов детальнее мы разберем в следующей статье.