Что такое цветовой круг?
Цветовой круг — это схема, которая располагает цвета по окружности. Цвета, которые лежат рядом, похожи друг на друга. Цвета, которые лежат напротив, отличаются сильнее всего.
Исаак Ньютон нарисовал одну из первых версий в XVII веке. С тех пор художники и дизайнеры пользуются им, чтобы понимать цвета и уметь их сочетать. Очень известен и цветовой круг Иоханнеса Иттена из Баухауса.
Есть две основные модели: традиционная модель из живописи и цифровая модель для экранов.
Традиционная модель RYB (живопись)
Это модель, которую изучают в школе. Она называется RYB по английским словам «красный», «жёлтый» и «синий».
- Основные цвета: красный, жёлтый и синий. Их нельзя смешать из других цветов.
- Вторичные цвета: оранжевый (красный + жёлтый), зелёный (жёлтый + синий) и фиолетовый (синий + красный).
- Третичные цвета: смесь основного цвета с соседним вторичным. Это красно-оранжевый, жёлто-оранжевый, жёлто-зелёный, сине-зелёный, сине-фиолетовый и красно-фиолетовый.
Всего в традиционном цветовом круге 12 цветов. Он помогает в живописи, иллюстрации и понимании гармоний.
Цифровая модель RGB (экраны)
Экраны создают цвет светом. Они смешивают три цвета света: красный, зелёный и синий. Поэтому модель называется RGB.
- Основные цвета: красный, зелёный и синий.
- Вторичные цвета: жёлтый (красный + зелёный), голубой, или циан (зелёный + синий), и пурпурный (синий + красный).
- Все три цвета света в полную силу дают белый. Без света получается чёрный.
HEX-коды вроде #FF0000 описывают цвета RGB. Поэтому они стандарт в веб-дизайне и дизайне приложений.
Для печати есть другая модель, CMYK: голубой, пурпурный, жёлтый и чёрный. С ней работают типографии.
На практике гармонии в обеих моделях работают похоже. Меняется то, какой цвет лежит напротив другого. В модели RYB, например, дополнительный цвет к красному — зелёный, а в модели RGB — голубой.
Тёплые и холодные цвета
Если разделить цветовой круг на две половины, получатся две группы:
- Тёплые: красный, оранжевый и жёлтый. Они кажутся энергичными, близкими и живыми. Кажется, что они выступают навстречу зрителю.
- Холодные: зелёный, синий и фиолетовый. Они кажутся спокойными, сдержанными и упорядоченными. Кажется, что они отступают на задний план.
Температура есть и у отдельного цвета. Некоторые красные холоднее, с оттенком синего, а некоторые серые теплее, с оттенком коричневого.
Полезный трюк: холодные цвета используй для фона и больших площадей, тёплые — для того, что должно выделяться.
Гармония цветов
Гармонии — это сочетания, основанные на положении цветов в цветовом круге. Это быстрый путь к сбалансированным палитрам. Попробуй их в нашем инструменте гармония цветов.
Комплементарная
Два цвета, которые лежат в цветовом круге друг напротив друга. Например, синий и оранжевый.
Они дают самый сильный контраст. Благодаря им выделяется кнопка, цена или заголовок.
Как их использовать: не используй их в равной пропорции. Один выбери доминирующим, а второй используй как акцент. Избегай текста одного цвета на насыщенном дополнительном цвете: он рябит и утомляет глаза.
Аналоговая
Три цвета, которые лежат в цветовом круге рядом. Например, жёлтый, жёлто-оранжевый и оранжевый.
Они создают спокойные, естественные сочетания. В природе ты видишь их постоянно, например на закате или в лесу.
Как их использовать: выбери главный и второстепенный цвет, а третий используй для деталей. Добавь нейтральный цвет, чтобы не потерять контраст.
Триада
Три цвета на одинаковом расстоянии друг от друга на цветовом круге, которые вместе образуют треугольник. Например, красный, жёлтый и синий.
Они создают живые, сбалансированные палитры. Популярны в дизайне для детей, в играх и у весёлых брендов.
Как её использовать: пусть один цвет доминирует, а два остальных используй сдержаннее. Если получается слишком кричаще, снизь насыщенность одного или двух цветов.
Расщеплённая комплементарная
Ты берёшь цвет и вместо точно противоположного используешь два соседних с ним цвета. Например, синий с красно-оранжевым и жёлто-оранжевым.
Даёт много контраста, но меньше напряжения, чем комплементарная пара. Хорошая отправная точка.
Как её использовать: основной цвет занимает бо́льшую часть дизайна. Два остальных служат акцентами.
Тетрада
Четыре цвета, которые на цветовом круге образуют прямоугольник или квадрат. Это две комплементарные пары. Например, синий, оранжевый, зелёный и красный.
Это самая богатая гармония, но и самая сложная.
Как её использовать: один доминирующий цвет, один второстепенный и два акцента. Тёплые и холодные тона смешивай обдуманно и опирайся на нейтральные цвета.
Монохромная
Один цвет на разных уровнях светлоты и насыщенности. Например, разные оттенки синего.
Выглядит элегантно и цельно, и ею легко пользоваться. Её часто можно увидеть на корпоративных сайтах и в интерфейсах.
Как её использовать: самый тёмный оттенок — для текста, средний — для важных элементов, светлые — для фона. Если хочешь что-то выделить, добавь один акцентный цвет.
Советы по работе с цветовым кругом
- Начни с гармонии, а потом подстрой её. Необязательно следовать ей буквально.
- Меняй светлоту и насыщенность, чтобы смягчить кричащие сочетания.
- Всегда добавляй нейтральные цвета: белый, чёрный, серый или бежевый.
- Проверяй, хорошо ли читается текст на каждом фоне.