Цветовой круг Иттена онлайн
Перетаскивайте маркеры по кругу и выберите схему гармонии: комплементарную, триаду, аналоговую и другие. Круг сам подберёт сочетающиеся цвета и соберёт палитру с кодами HEX, которые можно скопировать в Figma, Illustrator или Photoshop.
Перетащите маркер: по кругу меняется оттенок, к центру цвет становится светлее
Основной цвет занимает фон, дополнительный — блоки, акцент — кнопки.
Что такое цветовой круг Иттена
Это 12 цветов, расставленных по кругу в порядке спектра. Его предложил художник и преподаватель Баухауза Иоханнес Иттен. Основные цвета в нём жёлтый, красный и синий, между ними составные: оранжевый, фиолетовый и зелёный, и ещё шесть промежуточных. Наш круг плавный, как в Adobe Color: между 12 цветами Иттена есть все переходные оттенки, а к центру цвета светлеют.
Дизайнеры пользуются кругом, чтобы подбирать сочетания не наугад, а по понятным правилам. Подробно о схемах и правиле 60–30–10 мы рассказали в статье «Цветовой круг и сочетание цветов».
Сочетание цветов на круге: схемы гармонии
- Монохромная — один цвет и его оттенки. Спокойно и цельно.
- Аналоговая — соседние цвета. Мягко и гармонично.
- Комплементарная — цвета напротив друг друга. Самый сильный контраст.
- Расщеплённая — цвет и два соседа его противоположности. Контрастно, но мягче.
- Триада — три цвета через равные промежутки. Живо и ярко.
- Тетрада и квадрат — четыре цвета, две пары противоположных. Богатая палитра.
- Произвольная — каждый цвет ставите сами, без правил. Удобно, когда схема почти подходит и нужно поправить один цвет.
Как подобрать палитру за минуту
- Перетащите большой маркер на основной цвет бренда или проекта.
- Выберите схему гармонии. Для начала проще всего аналоговая или монохромная.
- Сдвиньте маркер к центру, если нужны пастельные тона, или убавьте яркость для глубоких.
- Посмотрите превью: если всё одинаково яркое, возьмите для фона светлый или тёмный вариант.
- Нажмите «Скопировать палитру» и вставьте коды в свой макет.
Проверить, насколько точно вы различаете оттенки, можно в бесплатном тесте на цветовосприятие.
Частые вопросы
Чем круг Иттена отличается от круга RGB?
Круг Иттена построен на художественных основных цветах: жёлтом, красном и синем (RYB). В круге RGB основные цвета экрана: красный, зелёный и синий. Поэтому противоположные цвета немного отличаются: у Иттена напротив красного зелёный, а в RGB голубой. Для подбора гармоничных сочетаний дизайнеры чаще пользуются кругом Иттена, его же по умолчанию использует Adobe Color.
Какие цвета сочетаются с синим?
Самый сильный контраст даёт оранжевый, он стоит напротив синего. Мягче смотрятся соседние сине-зелёный и сине-фиолетовый. Поставьте маркер на синий и переключайте схемы, чтобы увидеть варианты.
Сколько цветов брать в палитру?
Обычно 3–5: основной цвет, дополнительный, акцент и пара нейтральных для фона и текста. Больше цветов сложно удержать в системе.
Можно ли пользоваться кругом с телефона?
Да, круг работает в браузере на телефоне и компьютере, без регистрации и бесплатно.
Бесплатная лекция «Психология цвета»
Как цвет влияет на восприятие и как осознанно использовать его в дизайне. Зарегистрируйтесь, и лекция сразу откроется в личном кабинете.
Научитесь работать с цветом как дизайнер
На курсе графического дизайна с нуля вы разберётесь в цвете, композиции и типографике и за 7 недель сделаете 13 проектов. Academy Graphicmania — партнёр по учебной карте Töötukassa.