Как подобрать цвет для сайта: классические цветовые схемы

Монохроматические цветовые схемы:

Монохроматическая цветовая схема использует различные оттенки одного цвета.

Эта схема выглядит чисто и элегантно.

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

Вы можете использовать ее для создания впечатления "стильности", при этом основной цвет может быть нейтральным (черным, белым или серым), а дополнительные цвета и цвета для акцентов контрастными.

При использовании этой схемы бывает сложно выделить наиболее важные элементы.

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

Минусы:
Эта палитра не имеет цветового контраста. Она не выглядит яркой, как дополнительные цветовые схемы.

Советы:

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

Аналоговые цветовые схемы:

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

Аналоговая схема похожа на монохроматическую, но предлагает больше нюансов цвета.

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

Минусы:
Аналоговой цветовой гамме не хватает цветового контраста. Она не выглядит такой яркой, как дополняющие цветовые схемы.

Советы:

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

Дополняющие цветовые схемы:

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

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

Дополняющие схемы отличаются высокой контрастностью.

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

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

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

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

Советы:

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

Расширенные дополняющие схемы:

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

Это обеспечивает высокую контрастность без резкости, как в дополняющих схемах.

Плюсы:
Расширенные дополняющие палитры предлагают больше нюансов, чем просто дополняющие, сохраняя при этом сильный визуальный контраст.

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

Советы:

• Чтобы сделать акцент на теплых цветах, используйте один теплый цвет + несколько холодных цветов, (красный + синий и сине-зеленый или оранжевый + синий и сине-фиолетовый).
• Избегайте использования ненасыщенных теплых цветов (например, коричневого или желтого) - это скучно и это может сделать негармоничным сочетание цветов в палитре.

Триадные цветовые схемы:

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

Дизайн, выполненный на основе триадной схемы выглядит не столь контрастным, как на основе дополнительной схемы, но является более сбалансированным и гармоничным.

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

Минусы:
Результат использования триадной цветовой схемы будет не столь контрастным, как при использовании дополняющей схемы.

Советы:

• Выберите один цвет, который будет использоваться в больших количествах, чем другие выбранные цвета.
• Если цвета выглядят слишком яркими, попытайтесь немного обесцветить их (сделать более тусклыми).

Тетраидные (двойные дополнительные) цветовые схемы:

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

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

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

Минусы:
В этой палитре очень сложно подобрать удачно сочетающиеся цвета (сбалансировать цвета).

Советы:

• Если схема выглядит несбалансированной, попробуйте приглушить один или несколько цветов.
• Не используйте чистые цвета в равных количествах.

Вольный перевод статьи Classic Color Schemes - http://www.color-wheel-pro.com/color-schemes.html

Используемые в статье схемы созданы при помощи Color Wheel Pro - программы, которая позволяет создавать цветовые схемы и просматривать их на реальных примерах.

Помощь по разблокировке

Для того чтобы снять блок и увидеть ссылку на закачку, подпишитесь на обновления блога.

* Ваше имя: 

* Ваш e-mail: 

В каждом пришедшем письме публикуется код разблокировки.

Пользуйтесь кодом только из последних, пришедших вам на Email, писем.

Буду благодарна, если Вы поделитесь этой статьей:

Твитнуть

Присоединяйтесь ко мне в этих сервисах: