6 классических схем для сочетания цветов на цветовом круге

[aeplug]

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

Цветовой-круг.jpg (75.84 КБ) 17430 просмотров

Цветовой-круг.jpg (75.84 КБ) 17430 просмотров

Вот шесть основных схем цветовых сочетаний, которые вы можете начать использовать уже сейчас:

1. Монохроматические цвета (Monochromatic)

1 Monochromatic.jpg (43.76 КБ) 17431 просмотр

1 Monochromatic.jpg (43.76 КБ) 17431 просмотр

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

2. Аналогичные цвета (Analogous Colors)

2 Analogous.jpg (49.19 КБ) 17431 просмотр

2 Analogous.jpg (49.19 КБ) 17431 просмотр

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

3. Триады (Triads)

3 Triadic.jpg (53.74 КБ) 17431 просмотр

3 Triadic.jpg (53.74 КБ) 17431 просмотр

Контрастная яркая схема их трех цветов с одинаковым расстоянием между друг другом на круге.

4. Дополняющие цвета (Complementary Colors)

4 Complementary.jpg (56.82 КБ) 17431 просмотр

4 Complementary.jpg (56.82 КБ) 17431 просмотр

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

5. Расщепленные дополняющие цвета (Split Complementary Colors)

5 Split Complementary.jpg (61.5 КБ) 17431 просмотр

5 Split Complementary.jpg (61.5 КБ) 17431 просмотр

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

6. Прямоугольная схема (Tetradic Colors)

6 Tetratic.jpg (77.38 КБ) 17431 просмотр

6 Tetratic.jpg (77.38 КБ) 17431 просмотр

Схема, состоящая из двух комплиментарных. Может быть выполнена в виде квадрата (равноудаленные цвета) или прямоугольника. Рекомендуется один цвет выбирать в качестве доминирующего.

Больше информации с примерами вы может найти в этом видео: Мастер-класс "Понимание цвета" Understanding Color
https://www.youtube.com/watch?v=wuCEHnw2N4g
Еще одно полезное видео: Построение композиции
https://www.youtube.com/watch?v=izKlGmEZHAM

[aeplug]

Несколько инструментов для подбора цветов с использованием цветового круга, которые доступны прямо из вашего браузера.
Цветовой круг | Цветовые схемы - Adobe Color CC
https://color.adobe.com/
Наверное самый известный сервис от компании Adobe с некоторыми элементами интеграции в его облачные сервисы. Ранее был известен под именем Kuler.

Adobe Color.jpg (71.6 КБ) 17420 просмотров

Adobe Color.jpg (71.6 КБ) 17420 просмотров

ColorScheme.Ru — Цветовой круг он-лайн: Подбор цветов и генерации цветовых схем
http://colorscheme.ru/
Интересный сервис в русском сегменте интернета с множеством настроек, предпросмотром на web странице и неплохими параметрами экспорта.

colorscheme.jpg (56.09 КБ) 17420 просмотров

colorscheme.jpg (56.09 КБ) 17420 просмотров

Paletton - The Color Scheme Designer
http://paletton.com/
Просто еще один

paletton.jpg (47.56 КБ) 17420 просмотров

paletton.jpg (47.56 КБ) 17420 просмотров

---

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

Color Palette Generator: Automagically create a color palette from any photo.
https://bighugelabs.com/colors.php

bighugelabs.jpg (40.57 КБ) 17420 просмотров

bighugelabs.jpg (40.57 КБ) 17420 просмотров

Create Natural Palettes from Images - Color Palette Generator
http://palettegenerator.com/

palettegenerator.jpg (51.33 КБ) 17420 просмотров

palettegenerator.jpg (51.33 КБ) 17420 просмотров

Color Palette Generator
http://www.degraeve.com/color-palette/

degraeve.jpg (25.5 КБ) 17420 просмотров

degraeve.jpg (25.5 КБ) 17420 просмотров

Pictaculous - A Color Palette Generator
http://www.pictaculous.com/

pictaculous.jpg (33.73 КБ) 17420 просмотров

pictaculous.jpg (33.73 КБ) 17420 просмотров

Color palette generator
https://www.canva.com/color-palette/
Еще один онлайн-генератор палитры на основе загруженного изображения. Перетаскиваете любую фотку — получаете 5 цветов в виде hex-кода.

Color palette generator.jpg (58.65 КБ) 13038 просмотров

Color palette generator.jpg (58.65 КБ) 13038 просмотров

PALETTE GENERATOR
https://learnui.design/tools/data-color-picker.html

PALETTE GENERATOR.jpg (17.89 КБ) 11650 просмотров

PALETTE GENERATOR.jpg (17.89 КБ) 11650 просмотров

Генератор палитр между двумя крайними цветами.

Google Art & Culture Experiment - Art Palette
https://artsexperiments.withgoogle.com/artpalette/

Google Art Palette.jpg (41.26 КБ) 11238 просмотров

Google Art Palette.jpg (41.26 КБ) 11238 просмотров

Еще один сервис от Google, позволяет загружать изображения и показывает похожие по цвету.

[aeplug]

А если совсем не хочется заморачиваться, то на многих подобных сайтах можно ознакомиться с популярными подборками, подготовленными и сохраненными другими дизайнерами. Например вот так это выглядит на сайте Adobe https://color.adobe.com/ru/explore/ Просто выбираете самую приглянувшуюся и используете в своем проекте.

Adobe Color Popular.jpg (122.79 КБ) 17415 просмотров

Adobe Color Popular.jpg (122.79 КБ) 17415 просмотров

Для After Effects существует специальный скрипт Ray Dynamic Color, который облегчает подбор и работу с цветами. А за счет выражений даже создается возможность их быстро менять во всем проекте за пару щелчком мыши.
Обзор Ray Dynamic Color для After Effects
https://www.youtube.com/watch?v=lahk5dRw8uM

[ddd]

Источник цитаты Каждому дизайнеру нужно хотя бы раз ознакомиться с понятием цветового круга

Звучит как «Каждому хирургу нужно хотя бы раз ознакомиться с понятием скальпеля». Куда мы катимся…

Вот, обязательно к регулярному чтению, пока наизусть не выучится — Иоханнес Иттен «Искусство цвета».
Лучше брать книгу, там постарались с точностью цветов, а сканы в интернете — уже не то.

А то у нас «дизайнером и фотографом может быть каждый».

[aeplug]

Крутая шпаргалка по сочетанию цветов
http://infogra.ru/design/krutaya-shparg ... yu-tsvetov