Палитры сочетания цветов: Attention Required! | Cloudflare

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

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

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

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

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

Зависимость цвета сайта и его стиля от ЦА

Выбор стиля сайта с точки зрения его цветового исполнения должен напрямую зависеть от целевой аудитории, ее возрастной категории, рода занятий, предпочтений и интересов. Представьте ситуацию. Сайт продает новые марки автомобилей. Соответственно, целевая аудитория у него — состоятельные мужчины возрастом от 35 лет. А теперь подумайте, захочет ли посетитель вашего сайта просмотреть предложения, если сайт будет исполнен в розовом цвете? Очень сомнительно. В данном случае ресурс и сама компания-продавец будет восприниматься несерьезно, отсюда и будет сформирована репутация компании. Вот вам яркий пример сайта по продаже вязаных изделий, где ЦА, в основном, женщины. Не впечатляет, правда?

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

Цветовая гамма для сайта: как выбрать?

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

Принцип выбора цветовой палитры в соответствии с ЦА

Если говорит обобщенно о цветовых решениях, то рекомендуем опираться на следующие рекомендации:

• Для сайтов на детскую тематику лучшие цвета для сайта — яркие, контрастные и позитивные;
• Для ресурсов, где ЦА — девушки и женщины — нежные, светлые;
• Для сайтов, где целевая аудитория — мужчины — темные или нейтральные.

Конечно, каждый нюанс нужно продумывать. Если у сайта целевая аудитория и мужчины, и женщины (например, компания продает товары общего потребления), то в таких случаях следует опираться на нейтральность. Не малое значение имеет и фирменный стиль компании. Если он уже существует и укреплен на рынке (например, логотип или бренд всем знаком), то преобладающими цветами на сайте должны быть «фирменные». Но, все же, о правилах контрастности и мотивации к действию с помощью цвета забывать не стоит.

Сочетание цветов для сайта

На самом деле процесс выбора сочетающихся между собой цветов не такой уж и сложный. Главное, придерживаться принципа простоты — не использоваться более 3-4 разных цветов, подбирать сочетающиеся между собой оттенки. В этом случае поможет цветовое кольцо, созданное Ньютоном еще в начале 18 века. Конечно, этот пример уже устаревший, так как дизайнерам и архитекторам представлена возможность выбирать среди тысячи оттенков с помощью специальных сервисов в режиме онлайн, о которых мы расскажем дальше.

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

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

Цветовые контрасты

У каждого цвета есть свой противоположный цвет. Оттенками, контрастными основному выбранному цвету, чаще всего делают акценты на сайте — выделяют триггеры, заголовки, подзаголовки, текст. Контрастные цвета привлекают внимание человека и создают своеобразную мотивацию к действию. Определить два цвета, контрастные друг другу, очень легко. Для этого нужно выбрать один цвет из круга и провести линию к другому, расположенному на противоположной стороне.

Создавать контрасты цветов можно несколькими способами.

Цветовые тоны

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

Светлота тона

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

Температура тона

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

Интенсивность цвета

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

Цветовое распространение

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

Как воспринимается цветовая палитра сайта пользователем?

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

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

Красный

Эмоции: страсть, любовь или опасение, важность.

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

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

Оранжевый

Эмоции: позитив, дружелюбие, движение, энергия, молодость.

Как самый теплый оттенок красной палитры, оранжевый может вызывать большой ассоциативный ряд. Однако все ассоциации будут положительные. Если взять оранжевый в качестве основного фона, то он создаст ощущение «молодежности» и вызовет положительные впечатления. Вот яркий пример тому.

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

Желтый

Эмоции: радость, счастье, энтузиазм.

Желтый вызывает бодрость и добавляет энергии сайту. Его восприятие можно сравнить с красным, но ассоциации будут несколько мягче. Следовательно, и сайт будет восприниматься пользователем по-другому. Желтый — цвет солнца и детства, но, в зависимости от тематики сайта, может играть отнюдь не детскую роль. Наоборот, он позволит показать потребителю, что такой сайт принадлежит профессионалам. Судите сами, этот пример показывает как яркий и позитивный цвет вызывает доверие к компании.

Зеленый

Эмоции: спокойствие, благополучие, рост, стабильность.

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

Синий

Эмоции: спокойствие, открытость, безопасность.

В зависимости от насыщенности цвета, его можно воспринимать по-разному. Например, как знак доверия, используются светлые тона (обратите внимание, социальные сети Твиттер, ВКонтакте и Facebook используют именно светло-синий цвет). Темно-синие оттенки создают ощущение надежности. В этом примере сайт компании идеально отображает и профессионализм, и надежность. Синий цвет смотрится богато и роскошно.

Фиолетовый

Эмоции: богатство, помпезность, роскошь или тайна, мистика.

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

Темные цвета на сайте навевают романтику и таинственность.

Белый

Эмоции: добро, чистота, доступность.

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

Белый цвет создает эффект минимализма, но, вместе с тем, делает сайт стильным. На сегодняшний день подобное решение — самое модное и трендовое.

Черный

Эмоции: изысканность, власть.

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

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

Как выбрать цвет для сайта: определяемся между основным, вторичным и фоновым

Выбирая цветовую палитру для своего сайта, подбирайте каждый цвет поэтапно:

1. Для начала следует определить основной цвет. Этот цвет, как правило, используется в большей мере, им могут выделяться основные заголовки или важная информация;
2. Выбираем вторичный цвет — цвет, которым будет выделяться второстепенная по важности информация;
3. Акцентирующий цвет — самый важный инструмент для привлечения внимания посетителя. Он должен быть контрастным, выделяющемся и на основном, и на фоновом цвете;
4. Фоновый — цвет, который преобладает на сайте, заполняя свободное пространство. Должен взаимодействовать со всеми выбранными оттенками, не привлекать на себя внимание.

Рассмотрим на примере использование всех цветов

В качестве основного цвета выбран белый. Как видим, белым цветом выделены названия категорий, заголовок и другая информация. Вторичным цветом стал голубой, акцентирующим — красный, фоновым — коричневый. Несмотря на то, что коричневый — достаточно тяжелый для восприятия цвет, в данном случае он уместен. Став «невидимым», он не привлекает к себе внимания, лишь подчеркивая остальные выбранные цвета. Таким образом, информация воспринимается сразу, и лишь акценты красного не позволяют отвлечься.

Лучшие цветовые схемы для сайта: несколько примеров для вашего вдохновения

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

Пример 1

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

Пример 2

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

Пример 3

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

Пример 4

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

Пример 5

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

Популярные сервисы для подбора цветовой палитры сайта

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

Colorscheme

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

In Color Balance

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

Design Palette

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

Paletton

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

Какой должна быть палитра цветов для сайта?

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

Понравилась статья? Ставьте лайки и подписывайтесь на наш блог!

Следующий проект:17 примеров лучших сайтов ресторанов и кафеПредыдущий проект:Правильная структура веб сайта под SEO: примеры, виды и 15+ рекомендации по разработке структуры

15 сервисов для игры с цветом

Попытки найти идеальное цветовое решение уходят корнями далеко вглубь истории, к шедеврам великих художников. Теперь поисками идеального сочетания цветов, как филосовского камня, занимаются дизайнеры. Как сказал французский импрессионист Клод Моне: «Цвет – моя каждодневная одержимость, моя радость и моя мука».

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

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

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

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

2. Сolourlovers – это серьезный ресурс, где люди не просто выбирают палитры цветов, но и говорят о цвете. Здесь можно найти и бесшовные текстуры, и готовые палитры. Также, на этом ресурсе есть форум, где ведется общение.

3. Главное преимущество Colorscheme в том, что весь процесс работы происходит в пределах одного экрана, то есть вам не нужно переходить на другие страницы. Первый шаг – выбор цветовой модели для будущего веб-проекта. Вы можете комбинировать холодные и теплые оттенки. Далее, изменяете яркость и контрастность, вы можете использовать готовые стили. Справа можно видеть результаты своей работы. Также, есть предварительный просмотр готового сайта, конечно же, примерный. Этот ресурс будет крайне полезен начинающим дизайнерам.

Очень порадовал список с названиями цветов.

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

5. ColorBlender – простой в использовании инструмент для создания цветовых палитр для веб-разработки. Основная функция этого ресурса – создание палитры из шесть цветов. Вы выбираете один, а программа подбирает остальные пять соответствующих цветов. Это позволяет легко и быстро создавать палитры.

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

7. ColorExplorer является бесплатным инструментом для проектирования и работы с цветовой палитрой. Набор инструментов сайта не ограничивается подбором цветов, вы можете просматривать популярные библиотеки цветов, соединять библиотеки, экспортировать палитру в популярные программы, такие как AdobePhotoshop, Illustrator и многие другие. Также, можно импортировать цвета из изображений. Этот сайт был разработан специально для профессиональных дизайнеров. Тут нет регистрации, подобранную палитру можно просто сохранить. Однако, если вы хотите защитить свою палитру от посторонних глаз, можно создать и свой собственный профиль.

8. Главная идея Сolr: игра с цветом и цветовыми схемами. Этот сайт является одновременно игрушкой и серьезным генератором идей.

9. С ColorCombos вы попадете в мир цветов, в котором вы обязательно найдете свою идеальную цветовую палитру. Этот сайт был создан, чтобы помочь веб-разработчикам и дизайнерам быстро выбирать и тестировать различные комбинации цветов. Библиотека ресурса содержит сотни и тысячи образцов цвета. С помощью данного ресурса можно создать красивый сайт с отличным сочетанием цветов.

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

11. На Сolrd можно создавать схемы цветов, шаблоны, загружать изображение, чтобы узнать его цветовую гамму и многое другое.

12. ColorHunter – это ресурс, на котором можно найти и создать цветовые палитры, сделанные из изображений. Чтобы найти цветовые палитры на сайте, нужно ввести поисковый запрос в поле в верхней части страницы. Поиск можно осуществить по тегам, шестнадцатеричному коду цвета или ссылке на изображение. Изображение, также, можно загрузить из ПК.

13. Mudcu позволяет имитировать девять видов цветовой слепоты.

14. Etsy – это самый забавный и необычный способ подобрать цвет.

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

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

Источник: templates.motocms.ru

ТОП-40 Программ для Подбора Цвета — Plerdy

Нас постоянно окружают тысячи цветов и десятки тысяч оттенков.

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

Содержание

WEB-ориентированные Color Picker
1. Cohesive Colors
2. Сolourco
3. Colorblender
4. Colorsontheweb
5. Webcolourdata
6. Paletton
7. Adobe Color CC
8. Colourlovers
9. Copaso
10. Colorexplorer
11. Colrd
12. Colorhexa
13. Gradients
14. Htmlcolorcodes
15. Color picker
16. Chrome Dev Tools
17. Eye Dropper
18. ColorPick Eyedropper
Десктопные color picker
19. Instant Eyedropper
20. Just Color Picker
21. Colormania
22. ColorPic
23. Pixie
24. GPick
25. Pick
26. Gcolor2
27. ColorSnapper 2
Мобильные color picker
28. iDropper: the color sampling tool
29. Pixel Picker — Image Color Picker
30. ColorAssist Lite
31. Color Mate — Convert and Analyze Colors
32. Pixolor — Live Color Picker
33. Color Grab
34. RAL простой каталог цветов
35. Color Lab
JS color picker
36. Tiny Colorpicker
37. Spectrum
38. Pick-a-Color
39. Eyecon Colorpicker
40. Farbtastic
Вывод

WEB-ориентированные Color Picker

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

1. Cohesive Colors

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

2. Сolourco

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

3. Colorblender

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

4. Colorsontheweb

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

5. Webcolourdata

Оригинальный сервис, который позволяет получить все цвета интересующего вас веб-сайта. Для примера, на главной странице указаны результаты анализа различных известных ресурсов: Facebook, Instagram, Microsoft. Для того чтобы получить анализ того сайта который нам интересен, нужно вставить его URL в соответствующее поле и, после обработки, получить результат. Кроме перечня цветов и их процентного соотношения, пользователь увидит специализированные диаграммы.

6. Paletton

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

7. Adobe Color CC

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

8. Colourlovers

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

9. Copaso

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

10. Colorexplorer

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

11. Colrd

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

12. Colorhexa

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

13. Gradients

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

14. Htmlcolorcodes

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

15. Color picker

Этот пункт нашего ТОПа, пожалуй, наиболее уникален. Для того чтобы получить простенький колор пикер, нужно, всего лишь, ввести в гугл ключевой запрос «color picker», после этого вам отобразится эта палитра.

16. Chrome Dev Tools

Chrome Dev Tools — это инструменты разработчика для браузера Google Chrome. Однако и в нем можно найти средство для подбора цветов. Для начала нужно вызвать инструменты разработчика. Нажмите комбинацию клавиш Ctrl + Shift + T или кликните правой кнопкой мыши по веб-сайту и в контекстном меню выберите пункт «Просмотреть код». После этого выберите элемент который вас интересует, в окне style вы сможете увидеть цвет этого элемента. Если один раз кликнуть по цвету, можно будет перейти к встроенному color picker.

17. Eye Dropper

Этот Color Picker является ничем иным как расширением для браузера Google Chrome. С его помощью можно как легко подобрать цвет из палитры, так и использовав «пипетку» узнать цвет любого элемента веб-страницы.

18. ColorPick Eyedropper

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

Десктопные color picker

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

19. Instant Eyedropper

Instant Eyedropper — это первый в нашем списке color picker разработан для настольных компьютеров под OS Windows. С его помощью можно быстро извлечь любой цвет, просмотреть его в различных форматах записи и скопировать код.

20. Just Color Picker

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

21. Colormania

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

22. ColorPic

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

23. Pixie

Этот колор пикер является прекрасным представителем минимализма. Его функциями являются отображение цвета согласно позиции курсора и отражение его в различных формах записи.

24. GPick

Первый в нашем списке color picker под операционную систему Linux. Обладает всем необходимым функционалом для подбора оттенков и цветов. Благодаря удобному графическому интерфейсу пользуется высоким спросом.

25. Pick

Этот color picker славится своим минимализмом. С работодателем Pick можно извлечь цвета с позиции курсора и сравнивать их. А также запоминать изображение с которого получаем оттенок.

26. Gcolor2

ColorSnapper 2 — это единственная программа в нашем списке под OS X. Имеет удобный интерфейс и набор горячих клавиш для максимально быстрой работы. Также с ее помощью можно подобрать цвет благодаря многофункциональной пипетке.

27. ColorSnapper 2

ColorSnapper 2 — это единственная программа в нашем списке под OS X. Имеет удобный интерфейс и набор горячих клавиш для максимально быстрой работы. Также с ее помощью можно подобрать цвет благодаря многофункциональной пипетке.

Мобильные color picker

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

28. iDropper: the color sampling tool

Этот color picker разработан специально под мобильную операционную систему iOS. В дополнение встроенная функция «пипетки». Также цветовой палитры, которая позволяет подобрать необходимый цвет и оттенок.

29. Pixel Picker — Image Color Picker

Данное приложение подбирает цвета на любом экране iPhone или iPad. Благодаря удобной пипетке это можно сделать максимально просто и быстро.

30. ColorAssist Lite

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

31. Color Mate — Convert and Analyze Colors

С помощью Color Mate можно как «вытянуть» цвет с помощью пипетки, так и дальнейшем модифицировать его под тот оттенок который нужен пользователю. Также можно сравнивать и искать цвета по гаммах.

32. Pixolor — Live Color Picker

Простенький color picker с помощью которого можно получить цвет из любого «экрана» вашего устройства. Имеет минималистичный интерфейс и удобную пипетку.

33. Color Grab

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

34. RAL простий каталог кольорів

Удобный и простой в использовании каталог цветов под Android. Благодаря приложению можно легко выбрать нужный оттенок из большого перечня вариантов и узнать разные форматы его записи.

35. Color Lab

Color Lab — это приложение для Android который имеет в себе пипетку, палитры и другие инструменты для подбора цвета. Дополнительными преимуществами продукта является возможность сохранять цвета и широкий функционал.

JS color picker

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

36. Tiny Colorpicker

Этот color picker является ничем иным как JQuery библиотекой которую можно просто встроить на свой сайт. С ее помощью можно как подобрать цвет так, и выбрать вариант с уже готовой палитры.

37. Spectrum

Spectrum базируется на html5 и JQuery, поэтому работает в большинстве современных браузеров. С помощью этого колор пикера можно подбирать и сравнивать оттенки, а благодаря его архитектуре его просто устанавливать на собственный сайт.

38. Pick-a-Color

С помощью этого программного продукта можно легко выбрать любой цвет. Особенностью Pick-a-Color является возможность подбора цветов не только с помощью стандартной манипуляции синим, красным и зеленым, а и другие комбинации.

39. Eyecon Colorpicker

Этот JQuery плагин помогает в подборе цветов и сравнении оттенков. Этот Color Picker похож на инструменте в Photoshop. Основным преимуществом является легкость интеграции на свой сайт.

40. Farbtastic

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

Вывод

На этом и завершается наш список ТОП-40 инструментов для работы с цветом. Надеемся он был полезен как для простых пользователей, так и для дизайнеров и других людей, чья работа непосредственно связана с цветами. Теперь вы с легкостью сможете выбрать необходимый color picker независимо от того, на какой платформе работаете.
Благодарим Вас за прочтение этой статьи. Оставайтесь с нами, впереди еще много интересного!

Сочетание цветов в интерьере — таблицы сочетаемости, советы

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

Цветовое колесо

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

Сегодня цветовые круги состоят из одного, двух и трех дисков. На них видно, каковы отношения между цветами, расположенными по кругу. На оси круга расположены все цвета спектра – первичные, вторичные и третичные. Например, цветовое колесо Иттена:

Первичные цвета

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

Вторичные цвета

Шесть следующих цветов круга получены путем смешивания двух основных (первичных) цветов. Например, фиолетовый получен в результате смешивания красного и синего, а зеленый – синего и желтого, а вот оранжевый – это соединение красного и желтого.

Третичные цвета

Если смешать один первичный цвет с вторичным, то получится третичный тон. Итого – 12 цветов. Также получить третичный цвет можно, смешивая основной тон с большим количеством другого основного тона для создания третичного цвета. Например, одна часть синего тона с двумя частями красного создаст красно-фиолетовый цвет.

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

Оттенки и полутона

• Оттенки получаются из основного цвета. Например, синий имеет светло-голубой и темно-синий оттенок.• Тон является результатом добавления белого и черного (серого) к основному цвету. Тон в отличие от чистого пигмента делает цвет более мягким и приятным для глаз.

Как смешивать цвета

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

Совет:

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

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

Шкала определения пропорций цвета

По этой шкале можно определить пропорции тонов и полутонов. Безопасное соотношение для сочетаний цвета в интерьере 70/20/10. 70% -третичные оттенки в нейтральной базе20% – вторичные цвета 10% – первичный цвет

Совет:

Соблюдайте умеренность в смешивании цветов! Старайтесь не смешивать более нескольких оттенков. Максимально безопасным считается два или три цвета в нейтральной базе.

Различные цветовые схемы

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

Классическая триада

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

Аналоговая триада

Сочетания от 2-х до 5-ти цветов, расположенные рядом, составляют аналогичные сочетания или родственные. Например, желто-оранжевый, желтый, желто-зеленый, зеленый, сине-зеленый цвет.

Комплементарные сочетания

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

Прямоугольная схема

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

Квадратная схема

Сочетание четырех цветов, расположенных на равном расстоянии друг от друга. Динамичные цвета отличны по тону и, в то же время, дополняют один другого. Например: фиолетовый, оранжево-красный, желтый, сине-зеленый.

Правила использования цветовой схемы

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

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

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

Совет:

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

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

Температура цвета

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

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

Красный

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

Оранжевый

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

Желтый

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

Прохладные и успокаивающие цвета

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

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

Синий

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

Фиолетовый

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

Совет:

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

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

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

Сочетания цветов в различных комнатах

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

Пастельные сочетания цвета

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

Нейтральная цветовая палитра

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

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

Спальня

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

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

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

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

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

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

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

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

Гостиная

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

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

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

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

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

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

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

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

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

Зеленый в сочетании с родственными тонами и белым дает потрясающе освежающее ощущение.

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

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

Кухня

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

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

Заключение

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

Сочетание цветов в интерьере: фото, таблица, правила

Обновлено: 2 сентября 2018 г.

Сочетание цветов в интерьере — основа основ дизайна помещений и особенно жилых пространств.

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

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

О них мы сегодня и поговорим.

Содержание статьи

Психология цвета: почему так, а не иначе?

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

Мы различаем предметы по форме, размеру и…цвету.

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

Почему так?

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

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

Помните, в описаниях товара на AlieExpress часто прописывают: цвет может отличаться от действительного, в зависимости от настроек вашего монитора?

Так же и с глазами.

Если копнуть глубже, то окажется, что световые волны влияют не только на то, как мы о них “думаем” в момент восприятия, но и как мы к ним относимся. Есть цвета, которые кажутся нам больше, интенсивнее, насыщеннее. Их принято называть “теплыми”. Другие же — напротив, кажутся нам меньше, спокойнее, незаметнее. Они называются “холодными”.

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

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

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

Возьмем к примеру красный: у кого-то он ассоциируется с клубникой и летними каникулами, а у кого-то с кровью и больницей.

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

Сравните:

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

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

Есть в этом и свои плюсы.

Например, интерьер спальни можно и нужно (!) делать в такой цветовой гамме, которая действует на вас расслабляюще и усыпляюще. Чаще всего именно так воздействует на человека светло-бежевая палитра цветов. Но могут быть и исключения: если вам удается уснуть лишь в полной темноте и тишине, отдайте предпочтение интерьеру спальни в темной цветовой гамме.

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

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

Очень часто бывает, что на волне тренда модным становится выполнять интерьер в каком-то стиле или в каком-то цвете. Но не забывайте, что в погоне за модой вы легко можете потерять себя. То, что нравится всем подряд, для вас может оказаться неподходящим и некомфортным решением. А интерьер — не платье, за полчаса не сменишь. Так стоит ли рисковать?

Цветовой круг и правила его использования в интерьере

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

Удивительно, но факт: последователем Ньютона в исследовании цветов и составления цветового круга стал Гёте. И не какой-нибудь случайный однофамилец великого поэта, а лично автор “Фауста”. Мы не станем ворошить вехи его биографии и выяснять, заключал ли он мистические сделки ради этого открытия, а простом будем благодарны за то, что именно Гёте выявил 3 базовых цвета — синий, желтый, красный — в процессе смешения которых появляются остальные (вторичные) оттенки: зеленый, оранжевый, фиолетовый и всевозможные их вариации.

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

Круг Иттена является must have для каждого колориста-новичка, но многие именитые дизайнеры не расстаются с ним даже имея богатый и насыщенный опыт создания дизайна интерьера.

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

Таблица сочетания цветов в интерьере

Для самых ленивых или неуверенных в своем вкусе людей, дизайнеры разработали целые таблицы сочетания цветов.

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

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

(Подробнее о главном цвете 2018 года можно почитать здесь).

Выглядят таблицы Pantone вот так:

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

Если вы склонны вдохновляться образами, то более творческим вариантом станет использование цветовых схем, созданных на основе фото.

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

Так это или нет, вы можете проверить на наглядных примерах:

Принципы и типы сочетания цветов в интерьере

Существует несколько ключевых схем сочетания цветов.

Аналоговое сочетание цветов в интерьере

Сочетание нескольких схожих оттенков, плавно перетекающих друг в друга.

В цветовом круге оно выглядит вот так:

Как правило, такие сочетания часто встречаются в природе и рекомендуются для оформления “спокойных” пространств квартиры (спальня).

Комплементарное (контрастное) сочетание цветов в интерьере

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

Триадное сочетание цветов в интерьере

Сочетание трех оттенков — считается классикой и основой основ колористики. Оно используется в большинстве жилых пространств в квартире — в гостиной, в спальне, на кухне.

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

Сочетание четырех и более оттенков

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

12 популярных цветов в оформлении интерьера

Белый

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

Серый

Стал популярен в интерьерном дизайне не благодаря знаменитым “50-ти оттенкам”, а исключительно в силу своей глубины и многогранности. Характерен для стилей лофт, хайтек, минимализм, индустриальный. Стал востребованным после вхождения в моду необработанных бетонных текстур. Отлично сочетается с яркими теплыми оттенками.

Черный

Черный — это классика. Уместен практически во всех стилях интерьерного дизайна. Наравне с белым сочетается со всеми оттенками. Часто используется в качестве акцентного цвета, но в последнии годы усиливается тенденция к выбору его как основного цвета интерьера. Достаточно практичен для оформления спальни и гостиной, а вот в помещениях с водой (кухня, ванная комната, санузел) могут возникать трудности из-за белых мыльных разводов на черных поверхностях. Не рекомендуется к использованию в детской.

Красный

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

Оранжевый

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

Оранжевый как основной цвет очень характерен для стиля лофт. Однако допускается к использованию только один его оттенок: кирпичный.

Желтый

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

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

Зеленый

Цвет, ассоциирующийся с гармонией, природой и спокойствием. Известен своим расслабляющим воздействием в целом и на глаза в частности. Рекомендован к оформлению учебных заведений. Считается, что интерьер, выполненный в оттенках зеленого, помогает человеку перезагрузиться, вдохновиться и получить заряд бодрости и энергии. Допускается в оформлении ВСЕХ жилых пространств. Чаще всего используется в классическом и стиле эко.

Розовый

Нежный, игривый и даже несколько инфантильный оттенок. До 90% спален для девочек оформлены именно в нем. Сочетается  с белым, серым, черным, красным, фиолетовым цветами. Используется в стилях прованс, рококо, гламур, поп-арт и арт-деко.

Синий

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

Фиолетовый

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

Коричневый

Универсальный цвет натуральной древесины, благодаря чему является основным цветом классического интерьера. Считается нейтральным по всем параметрам.

Бежевый

Более мягкая и утонченная версия коричневого оттенка. Ненавязчивый, приятный, успокаивающий цвет. Очень часто используется в интерьере квартир и (особенно!) в спальнях. Прекрасно дополняет и подчеркивает большую часть оттенков, используемых в интерьере. Чаще всего используется в качестве основного цвета в сочетании с серым, коричневым, синим или черным.

Как Вы оцените эту статью?

Читайте также

Сервисы подбора цвета для веб-дизайна

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

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

Я не буду рассказывать про теорию цвета (это слишком объемная информация), а просто опубликую здесь сервисы, которые есть у меня в закладках и которыми я пользуюсь .

Сервисы подбора цвета для веб-дизайна

colorscheme.ru

С этим инструментом я дружу уже много лет. Наиболее удобный инструмент для подбора цветов (на мой взгляд). У него много дополнительных возможностей. Например можно посмотреть пример светлой и темной страницы с выбранными цветами.

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

 

color.adobe.com

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

Для этого надо нажать кнопку в левом верхнем меню «Смотреть». И перед вами откроется галерея всевозможных цветовых сочетаний.

 

paletton.com

Этот инструмент немного похож на Сolorscheme, но имеет меньше функций, зато есть возможность посмотреть, как будут выглядеть цветовые блоки.

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

 

Следующие два сайта генерируют палитру из выбранного вами изображения.  It is magic 🙂

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

Color Palette Generator

На этом сайте необходимо указать ссылку на изображение.

 

palettegenerator.com

На этот сайт нужно загрузить картинку со своего компьютера.

 

palettable.io

Очень удобный инструмент для подбора цвета. Основан на принципе «Нравится — Не нравится».

 

flatcolors.net

Как видно из названия, здесь можно подобрать цвета для модного сейчас, плоского дизайна. Сайт интересен тем, что выбрав палитру, вы можете скачать ее для программ Corel и Photoshop.

 

materialpalette.com

Еще один модный тренд —  материал дизайн. Данный сайт помогает подобрать сочетания цветов для UI (user interface). Дополнительно на сайте есть большой набор иконок.

 

getuicolors.com

И напоследок снова user interface.  Здесь просто набор цветов для UI дизайна. Нажав на любой цвет, можно посмотреть как на определенном фоне будет читаться белый текст.

Вот такие инструменты есть у меня в закладках.

Напишите в комментариях, какими сайтами подбора цвета для веб-дизайна пользуетесь вы?

Нужен сайт с правильными цветами? Пишите, сделаем 🙂

Нашли ошибку? Выделите фрагмент текста и нажмите CTRL+ENTER

Список ресурсов для создания идеальной цветовой палитры вашего сайта

Эффективный дизайн сайта немыслим без подбора цветового решения. Осталось разобраться, как это сделать.

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

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

Начнем с краткого введения в теорию цвета. 

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

На диаграмме не отражены оттенки, способные сделать цвет ярче, насыщеннее или темнее.

Оттенок (tint), насыщенность цвета регулируется добавлением белого; тень (shade), яркость — черного; тон (tone) меняется наложением коричневого.

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

Читайте также: Нейромаркетинг: психология оттенков

Что такое цветовая палитра?

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

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

Например, эта палитра выглядит вполне гармонично: 

Но она не позволит выделить те или иные элементы сайта. В нашем случае цвета должны не только гармонировать, но и отличаться друг от друга более явно, чтобы посетитель сайта мог сразу увидеть призывы к действию (call-to-action), элементы меню и важную информацию.

Этот вариант мало отличается от предыдущего, но позволяет выделить нужные моменты, оставаясь при этом гармоничным.

Похожую цветовую палитру можно увидеть в действии на werkpress.com

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

Читайте также: Цветовые схемы и палитры. Их значение и применение в веб-дизайне

Насколько важно выбрать правильную цветовую палитру?

Институт исследований цвета (CCICOLOR) утверждает, что у большинства людей впечатление складывается за 90 секунд. Это происходит на подсознательном уровне и на 62-90% зависит от цвета.

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

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

Но это сочетание хорошо подходит для Lamborghini: 

Мы не супермашины, мы Lamborghini

Цветовая палитра показывает, кто вы, какова ваша миссия и что можно от вас ожидать. Так, сайт Lamborghini несет сообщение о роскоши и силе.

Groupon использует другое цветовое решение. В нем много белого, а элементы бренда и конверсии выделены зеленым. 

Если вы не хотите, чтобы ваш сайт походил на фильм ужасов, стоит уделить палитре особое внимание. Она влияет на брендинг, UX и конверсию.

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

Читайте также: Психология веб-дизайна. Как цвета, шрифты и разметка влияют на ваше настроение

Подготовка

Вам необходимо вдохновение?

1. BrandColors

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

Ищете готовую палитру?

2. ColourLovers

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

Палитра сопровождается говорящими названиями: Шторм в Уитсанди (тихоокеанский архипелаг в Коралловом море), Сумерки в Уитсанди, Остров Уитсанди

3. ColorSchemer Gallery

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

4. ColoRotate

В ColoRotate вы найдете библиотеку цветовых схем, которые можно просматривать, выбирать и изменять. Сделать собственную палитру на основе найденной поможет специальный 3D инструмент (3D color tool). Цветовую схему, созданную вами, можно сразу применить в PhotoShop или Fireworks, установив ColorRotate plugin или приложение для iPad.

Читайте также: Цвета и их значение при создании дизайна веб-сайта

В соответствии с требованиями бренда

Что, если у вас уже есть картинки, логотипы или требования бренда, которым нужно соответствовать?

1. Color Hunter

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

2. Pictaculous

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

3. Adobe Color CC Color Wheel

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

4. Paletton

Paletton ускоряет процесс создания палитры. Нужно выбрать тип схемы: моно, составные, триадные, тетрадные, родственные, родственно-контрастные. Как только вы поменяете один цвет, остальные автоматически подстроятся.

5. Color Spire

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

6. MudCube Color Sphere

Этот плагин для Chrome помогает гармонизировать цвета, учитывать дальтонизм и идентифицировать HEX-коды. Цветовые палитры можно сразу экспортировать в Illustrator, PhotoShop и CoIRD.com.

7. Cohesive Colors

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

8. Hex Color Scheme Generator

Этот инструмент подбирает цвета, которые сочетаются с вашим. Он немного примитивнее, чем другие ресурсы в этом списке. Нужно вставить HEX-код цвета в строку или выбрать его на представленном в форме колеса спектре. Генератор выдает 3 цвета, которые подходят вашему, и сопровождает их HEX-кодами.

Читайте также: Какие 3 самых популярных цвета для оформления сайтов?

Создать свой цвет

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

1. The Color App

Это приложение для iOS помогает выбрать из нескольких цветов, которые размещаются рядом через небольшое расстояние, что намного удобнее градиентного представления, кругов и спектров. Большие цветовые сетки позволяют использовать весь экран (что особенно ценно для владельцев iPad Pro). В приложении можно создавать образцы цвета, находить RGB, HEX и HSLA значения и делать палитры из набросков.

3. Color

В Color от HailPixel не определиться с цветом нельзя. Вы точно поймете, что хотите и получите HEX-код оттенка.

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

Читайте также: Какие цвета лучше всего подойдут вашей посадочной странице?

Получить код цвета

Если вы увидели где-то цвет и хотите узнать его код и название, эти ресурсы для вас.

1. SpyColor

SpyColor предоставит информацию о любом цвете, включая Hex, RGB, CMYK и другие коды, и покажет целый диапазон схем для каждого оттенка, в том числе комплементарные, сплит-комплементарные, триадные, контрастные и аналоговые.

2. HTML Color Codes

HTML Color Codes находит HEX-код для цветов на изображении. Вы выбираете картинку, открываете ее для просмотра и получаете код цвета, наведя на него курсор.

Протестировать свою палитру

Создав цветовую схему, хочется удостовериться в ее эффективности.

Check my Colours

Check my Colours проверяет основные и фоновые цвета на соответствие требованиям контрастности для тех, чье цветовое восприятие имеет отклонения от нормы. Если вы хотите убедиться, что ваш сайт подходит для людей с дальтонизмом или получить работающие и интуитивно понятные цветовые сочетания с точки зрения UX, этот ресурс незаменим. Достаточно ввести адрес сайта, чтобы ознакомиться с отчетом по его внешнему виду.

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

Подбор изображений

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

1. TinEye

TinEye известен как альтернатива поиску изображений Google. Он поможет найти нужную цветовую комбинацию, используя базу в более 10 000 000 изображений с Flickr. Если вы ищете картинку, соотвующую вашей палитре, это отличный легкий способ ее найти.

2. Designspiration

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

Заключение

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

Высоких вам конверсий!

По материалам: crazyegg.com.

01-06-2017

Теория цвета и цветовые палитры — Полное руководство [2021]

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

Цвета обладают неизмеримой силой сообщать нам настроение, эмоции и мысли. Исследование, проведенное Институтом исследований цвета, показывает, что люди подсознательно оценивают продукт в течение 90 секунд после его просмотра, и от 62% до 90% этой оценки основываются только на цвете.

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

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

Вот что мы расскажем:

1. Что такое теория цвета?
2. Знакомство с цветовым кругом
3. Важность цветовой гармонии
4. Аддитивные и субтрактивные цветовые модели
5. Знакомство с цветовыми палитрами
6. Какие бывают типы цветовых палитр?
7. Как выбрать цветовую палитру
8. Лучшие онлайн-инструменты для выбора цветовой палитры
9. Заключительные мысли

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

1. Что такое теория цвета?

Давайте начнем с основ: что такое теория цвета?

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

Современная теория цвета в значительной степени основана на цветовом круге Исаака Ньютона, который он создал еще в 1666 году. Основное цветовое колесо отображает три категории цвета; основные цвета, вторичные цвета и третичные цвета. Если вы помните, как узнавали об этом на уроке искусства, молодец — вы уже постигли основы теории цвета!

Давайте кратко рассмотрим, что влекут за собой эти цветовые категории:

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

2. Знакомство с цветовым кругом

Вы можете подумать: «Существует более 12 цветов.«Вы правы — и все они могут быть найдены в более продвинутой версии цветового круга.

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

оттенок

Оттенок — это чистый пигмент цвета без оттенка или оттенка.В этом отношении оттенок можно интерпретировать как источник цвета. Любой из шести основных и дополнительных цветов является оттенком.

Оттенок

Оттенок означает, сколько черного добавлено в оттенок. Таким образом, оттенок затемняет цвет.

Оттенок

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

Тон

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

Цветовая температура

Даже если вы новичок в дизайне, вы, вероятно, слышали термины «теплый, холодный и нейтральный», используемые в отношении цвета. Это называется цветовой температурой и является важным фактором, когда речь идет о теории цвета.

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

3. Важность цветовой гармонии

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

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

Не знаете, как выглядит пользовательский интерфейс? Ознакомьтесь с нашим руководством о том, что такое пользовательский интерфейс и что вы можете найти в нем.

4. Аддитивные и субтрактивные цветовые модели

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

Аддитивная цветовая модель (RGB)

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

Субтрактивная цветовая модель (CMYK)

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

5. Знакомство с цветовыми палитрами

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

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

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

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

6. Какие бывают типы цветовых палитр?

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

Монохромный

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

Аналог

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

Дополнительные

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

Комплиментарно-раздельно

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

Триадический

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

Тетрадик

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

7. Как выбрать цветовую палитру

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

При выборе цветовой палитры для пользовательского интерфейса следует учитывать несколько моментов:

Изучите свою аудиторию

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

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

Чтобы узнать больше о том, как стать лучшим дизайнером, ознакомьтесь с нашей статьей о том, как избежать 10 самых распространенных ошибок дизайна пользовательского интерфейса!

Учитывайте психологию цвета

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

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

• Orange — энергичный и теплый. Некоторые общие ассоциации с оранжевым включают творчество, энтузиазм, беззаботность и доступность.
• Красный — цвет крови, поэтому он часто ассоциируется с энергией, войной, опасностью и силой, но также и страстью, желанием и любовью.Некоторые общие ассоциации с красным включают действие, приключения, агрессию и азарт.
• Желтый пробуждает позитив, молодость, радость, игривость, солнечный свет и тепло.
• Pink вызывает чувство невинности и нежности, благодарности, романтики, мягкости и признательности.
• Blue считается авторитетным, надежным и заслуживающим доверия. Общие ассоциации с синим включают спокойствие, безмятежность, уверенность, достоинство и безопасность.
• Зеленый — цвет природы. Он символизирует рост, свежесть, безмятежность, деньги, здоровье и исцеление.
• Черный олицетворяет силу, элегантность и авторитет. Общие ассоциации с черным также включают класс, различие, формальность, тайну, секретность и серьезность.

Выбирайте цвета с умом

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

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

Не экономьте на контрасте

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

Дизайнеры контролируют уровень контрастности в зависимости от того, чего стремится достичь интерфейс.Опытные дизайнеры стремятся создать умеренный уровень контраста и применять высококонтрастные цвета только для элементов, которые должны выделяться, например для призыва к действию. Это связано с моим следующим пунктом…

Придерживайтесь соглашений пользовательского интерфейса

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

Некоторые общие цветовые соглашения дизайна пользовательского интерфейса включают:

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

Соблюдение этих соглашений снизит когнитивную нагрузку на пользователей и позволит им интуитивно ориентироваться в интерфейсе.

Получить отзыв

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

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

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

Ниже мы собрали три лучших инструмента для создания цветовых палитр в Интернете.Сделайте ваш выбор!

Adobe Color

Будучи источником «хлеба с маслом» для всех цифровых креативов, Adobe Color предлагает практически все доступные цветовые палитры. По сравнению с другими генераторами цветовых схем Adobe Color намного более комплексный, поэтому не выбирайте его, если вам нужно что-то быстрое и простое. Среди ключевых функций Adobe Colors — генератор цветовой палитры, который извлекает цвета из загружаемых вами изображений.

Охлаждение

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

Руководство по цветам Adobe Illustrator

Adobe Illustrator Color Guide выделяется своей популярной функцией «цветовой справочник». После того, как вы выбрали цвет, справочник цветов сгенерирует для вас пятицветную палитру.Он также предоставит вам ряд оттенков и оттенков для каждого цвета в палитре. Если вы переключите основной цвет, цветовая шкала автоматически обновит соответствующие цвета, чтобы ваши акцентные цвета были дополнительными.

9. Заключительные мысли

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

Ищете вдохновение для дизайна пользовательского интерфейса? Посмотрите эти сообщения в блоге:

Окончательное руководство по цветам и цветовым палитрам

Следует помнить, что не все цвета в выбранной палитре должны быть представлены одинаково. Всегда есть доминирующий (или несколько) . Таким образом можно привлечь внимание к определенным частям страницы.Существует техника, известная как эффект изоляции, когда вы используете один цвет только для определенной цели. Например, кнопка «Добавить в корзину». Вы сделаете их все в одном ярком цвете и не будете использовать этот цвет ни для чего другого.

Типы цветовых схем

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

Монохроматическая цветовая схема использует вариации оттенков и оттенков одного и того же оттенка. Аналогичная цветовая схема использует цвета, расположенные рядом друг с другом на цветовом круге. Дополнительная цветовая схема использует цвета, противоположные друг другу на цветовом круге. Дополнительный разделенный — это цветовая схема, в которой используется один цвет и два других, которые находятся по обе стороны от противоположного цвета. Triadic Complementary (Triad) — это цветовая схема, в которой используются цвета, равномерно распределенные по кругу. Tetradic (Double Complementary) использует два набора дополнительных цветов.Если вы чувствуете себя достаточно уверенно, вы всегда можете пойти на что-то совершенно нестандартное, но в большинстве случаев лучше всего просто, поэтому не старайтесь создавать что-то новое, когда хорошо известные и часто используемые палитры работают. так же, как и.

Генераторы цветовой палитры

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

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

Adobe Color CC

• Генератор цветовых схем на основе типов цветовой палитры (монохроматическая, аналоговая и др.) ;
• Можно отдельно настраивать цвета в палитре;
• Раздел «Обзор» имеет несколько палитр, а также цветовые палитры с соответствующими изображениями;
• Имеет возможность создавать палитру на основе изображения;
• Возможность сохранения созданных вами палитр.

Paletton

• Простота использования — перетаскивание круга в цветовом круге;
• Вы можете проверить, как каждая цветовая палитра будет выглядеть на реальной странице, с помощью опции «Примеры»;
• Имеет раздел с предустановками, которые можно использовать и настраивать при необходимости;
• Можно экспортировать палитры в разные форматы.

Coolors

• Интуитивно понятный интерфейс, который создает палитру, просто щелкая пробел;
• В генераторе можно настроить всю палитру вместе или каждый оттенок отдельно;
• Coolors также имеет библиотеку готовых цветовых палитр;
• Вы также можете отфильтровать результаты, выбрав такой параметр, как, например, определенный цвет или «темный»;
• Расширение для Photoshop и иллюстратора;
• Особый вид для дальтонизма.

Canva

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

0to225

• Инструмент, позволяющий создавать более темные и светлые цвета для определенного цвета, который вы выбрали;
• Простой интерфейс, в котором вы можете сразу щелкнуть по выбранному цвету;
• Есть возможность ввести определенный цвет;
• Когда вы щелкаете по любому из созданных цветов, он мгновенно копируется в буфер обмена.

Примеры цветовой палитры

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

Цветовые палитры для свадьбы

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

Хелен и Джош

The Pittmans

Цветовые палитры для технологий

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

drawmote

JetStyle

Bloody

Цветовые палитры для окружающей среды

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

HuffPost

Дикая тайга

Sooma

Цветовые палитры для бизнеса

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

QAccount

notis

Zapare Technologies

Better Therapeutics

Цветовые палитры для продуктов питания

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

El Burro

Jude’s Ice Cream

Ресторан и бар Völlerei

Заключение

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

Выбор цветовой схемы с помощью цветового круга

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

Цветовые схемы и палитры

Фразы «цветовая схема» и «цветовая палитра» кажутся взаимозаменяемыми, но они разные.

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

Изучив несколько основных техник цветовой схемы, вы сможете выбрать цвет, который выражает ваш вкус и видение.

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

Типы цветовых схем

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

• Монохроматическая цветовая схема: Это цветовая схема только одного цвета. Используя вариации яркости и насыщенности, вы легко можете создать стильную схему, которая будет выглядеть профессионально оформленной. Нейтральные цвета — это элегантный выбор для однотонных цветовых схем.
• Дополнительная цветовая схема: Это цветовая схема с двумя цветами, расположенными напротив друг друга на цветовом круге.Эта цветовая схема может быть яркой с высоким контрастом, если цвета используются с одинаковой насыщенностью. Эта схема, естественно, будет включать теплый и холодный цвета, поскольку они находятся на противоположных сторонах колеса.
• Аналогичная цветовая схема: Это схема, в которой используются три смежных цвета. Аналогичная схема может быть очень гармоничной и расслабляющей. Схема сине-зеленого, зеленого и желто-зеленого цветов является примером аналогичной цветовой схемы. Эта схема выигрывает от наличия одного доминирующего цвета с двумя оставшимися цветами в качестве акцентов.Аналогичные схемы хорошо сочетаются с акцентными стенами и другими крупномасштабными акцентами, потому что цвета естественно гармонируют друг с другом.
• Цветовая схема Triad: Это схема с тремя цветами, которые равномерно распределены по цветовому кругу. Цветовая схема триады может включать зеленый, фиолетовый и оранжевый, поэтому следует соблюдать осторожность с насыщенностью выбранных вами цветов. Это еще одна схема, в которой выгодно выбрать один цвет, который будет доминировать, а два других станут акцентами.
• Split-Complementary: Это цветовая схема, в которой используются три цвета.Сначала выбирается один цвет, а затем включаются цвета по обе стороны от его дополнительного цвета. Менее драматичная, чем дополнительная цветовая схема, разделенная-дополнительная — это простая цветовая схема, которую можно создать и с которой можно жить.
• Тетрадическая цветовая схема: Это схема, в которой используются два набора дополнительных цветов. Работа с четырьмя цветами может быть более сложной задачей, но при этом можно получить полную и богатую цветовую схему. Использование доминирующего цвета с тремя акцентными цветами — один из способов гармонизировать четырехцветную цветовую схему.Другой способ создать приятную тетрадную схему — использовать приглушенные тона четырех цветов. Любая дополнительная схема будет содержать теплые и холодные цвета и требует особой осторожности, чтобы сбалансировать их.

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

Разбирая цветовые палитры 7 известных брендов

Пабло Пикассо однажды сказал: «Почему два цвета, поставленные рядом друг с другом, поют? Можно ли это объяснить? Нет.Так же, как рисовать никогда не научишься ».

Дамы и господа, Пикассо ошибался.

Вы на самом деле можете выяснить, почему «два цвета, поставьте один рядом с другим, пойте». Или, точнее, вы можете выяснить, почему одни цветовые комбинации работают (т. Е. Хорошо выглядят) и почему другие цветовые комбинации не работают (т. Е. Выглядят ужасно).

Я понимаю, что Пикассо, вероятно, имел в виду «никогда не научиться рисовать» менее буквальным, более философским способом. Например, нельзя научить кого-то иметь чувство стиля или развивать художественное чутье; что есть какая-то врожденная, непонятная черта, которая есть у некоторых людей, а у некоторых — нет.

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

Опять же, я бы не согласился.

С научной точки зрения, безусловно, правдоподобно, что некоторые люди генетически предрасположены к хорошему искусству и дизайну. Но я бы сказал, что «теория 10000 часов» делает это понятие неуместным. Для тех, кто не знаком с теорией 10000 часов, она утверждает, что любой может стать мастером определенного навыка при условии, что он практикует этот навык примерно в течение 10000 часов. при их жизни.

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

Практика создает идеальную палитру

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

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

Примечание: Обязательно прокручивайте медленно и медленно, чтобы у вас была возможность угадать, прежде чем раскрывать ответ!

Пример №1: Понимание различных цветовых моделей

Хорошо, начнем: с какого веб-сайта взята цветовая схема ниже?

Прокрутите вниз, чтобы убедиться, что вы правы!

.

.

.

.

.

Конечно, эта синяя, зеленая, желтая и красная цветовая палитра принадлежит не кому иному, как великому Google.

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

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

Теперь, если бы мы смешивали синюю и желтую краски, эта идея «смешивания» осталась бы верной. Но это потому, что мир живописи (и печати) придерживается модели CMYK — голубой (голубой), пурпурный (красноватый), желтый и ключевой (черный) — цветовой модели. По сути, эта цветовая модель состоит из трех основных цветов и черного, последний из которых используется для создания более темных версий цветов.

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

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

Со мной так далеко? Большой! Потому что цвета, которые вы видели в приведенном выше примере, не были созданы с использованием цветовой модели CMYK: они были созданы с использованием цветовой модели RGB (красный, зеленый, синий), которая используется в компьютерах, телевизорах и других электронных устройствах. В отличие от CMYK, RGB — это аддитивная модель. Красные, зеленые и синие световые волны складываются вместе в определенных комбинациях, чтобы получить цвета.

Итак, хотя зеленый цвет в цветовой палитре Google является второстепенным цветом в системе CMYK, на самом деле это основной цвет в системе RGB.И в целом цветовая схема Google кажется очень важной; или базовый. Как дошкольное учреждение или детский сад. (Я всегда думаю о тех деревянных блоках с нарисованными на них буквами, когда вижу цвета Google.)

Хорошо, хватит CMKY / RGB — это просто, чтобы дать вам ориентир для дальнейшего в этой публикации. Перейдем к следующему примеру.

Пример № 2: оттенок, оттенок, оттенок, тон и насыщенность

Веб-сайту какой компании принадлежит представленная ниже цветовая палитра?

Прокрутите вниз, чтобы убедиться, что вы правы !.

.

.

.

.

Цветовая палитра

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

Давайте быстро пробежимся по терминологии, и все это станет более понятным:

Оттенок: Что мы обычно имеем в виду, когда говорим о цвете.Оттенок — это всеобъемлющее, различимое качество цвета (например, «красный» или «синий»).

Оттенок: Что вы получаете, когда добавляете черный к определенному оттенку (например, темно-синий — это оттенок синего).

Оттенок: Что вы получаете, когда добавляете белый к определенному оттенку (например, голубой — это оттенок синего).

Tone: То, что вы получаете, когда добавляете и черный, и белый (он же серый) к определенному оттенку (например, пастельный синий — это оттенок синего).

Насыщенность: Хотя «тон» является популярным термином в живописи, в мире графического дизайна вы чаще встретите термин «насыщенность», когда имеете дело с добавлением серого к цвету.В частности, насыщенность определяет диапазон цвета, начиная с серого (насыщенность 0%) и заканчивая чистой формой цвета без серого (насыщенность 100%). Ненасыщенные цвета более мягкие и потенциально более тусклые по сравнению с их более насыщенными аналогами, которые являются более яркими.

А теперь вернемся к Twitter. Давайте возьмем синий цвет логотипа, более светлый синий, в качестве ориентира. Это наш оттенок. Это «синий Твиттер». Более темный синий — это просто оттенок синего цвета Twitter, но он имеет более высокую насыщенность, что делает его немного более ярким и привлекательным (что имеет большой смысл, учитывая, что Twitter использует этот синий цвет, чтобы привлечь внимание к их основному призыву к действию. : «Твитнуть»).

Серый цвет, используемый для значков, также является оттенком синего цвета Twitter, но его насыщенность значительно ниже (около 20%).

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

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

Пример № 3: Определение цветовой схемы

Хорошо, перейдем к следующему примеру. С чьего сайта создана эта цветовая палитра?

Прокрутите вниз, чтобы убедиться, что вы правы!

.

.

.

.

.

Этот был немного сложнее.Хотя большинство из нас знакомы со знаменитым коричневым (и зарегистрированным товарным знаком) UPS, этот синий может — на первый взгляд — показаться необычным. Но независимо от того, нравится ли вам этот синий цвет, есть очевидная причина, по которой UPS выбрал его: он дополняет коричневый.

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

А теперь есть еще один кусочек этой головоломки дополнительных цветов ИБП: где, черт возьми, вы найдете коричневый на цветовом круге?

Ответ: коричневый — это просто оттенок или более темная версия красновато-оранжевого. Итак, чтобы найти дополнение коричневого, вам сначала нужно найти красновато-оранжевый цвет на цветовом круге. И когда вы это сделаете, вы увидите, что синий появляется прямо напротив него.

Конечно, дополнительные цвета — не единственное сочетание цветов, которое может создать приятную палитру.Также есть …

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

Вот небольшая диаграмма, которая поможет вам лучше понять это:

По правде говоря, существует несколько других типов цветовых комбинаций, основанных на цветовом круге — это только самые основные.(Если вы хотите более глубокое погружение, посетите веб-сайт Tiger Color.)

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

Пример №4: Цвет и брендинг

С веб-сайта какой компании представлена ​​представленная ниже цветовая палитра?

Прокрутите вниз, чтобы убедиться, что вы правы!

.

.

.

.

.

В то время как UPS добавила новый цвет (синий) к своей типичной коричнево-желтой цветовой палитре при разработке своего веб-сайта, конкурент FedEx сделал наоборот: FedEx удалил оранжевый, который мы обычно видим на их грузовиках, и вместо этого удвоил фиолетовый.

В результате цветовые палитры веб-сайтов UPS и FedEx не могли быть более разными. В то время как UPS имеет всю эту земную атмосферу, используя цвета, которые могут появиться в природе, FedEx имеет больше «строго деловой» стиль.В их монохроматической схеме фиолетовый используется в качестве единственного акцентного цвета, который также добавляет этой палитре неорганический корпоративный вид, поскольку фиолетовый цвет редко встречается в природе (некоторые люди даже утверждают, что фиолетовый — это искусственный цвет).

Вывод: помните, что цветовая палитра вашего веб-сайта может повлиять на то, как люди воспринимают вас и ваш бизнес. Разные цвета соответствуют разным эмоциям. Коричневый цвет, например, обычно ассоциируется с прочностью и надежностью. А пурпурный цвет ассоциируется с авторитетом и изысканностью.

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

Пример № 5: Сопряжение дополнительных цветов

На каком популярном новостном веб-сайте представлена ​​цветовая палитра, указанная ниже?

Прокрутите вниз, чтобы убедиться, что вы правы!

.

.

.

.

.

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

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

А как насчет этого красного? Красный — самый эмоционально заряженный цвет, связанный со страстью, любовью, ненавистью и всем прочим. Итак, когда мы смотрим на домашнюю страницу HuffPost, неудивительно, что наши глаза сразу же привлекают эти две красные выноски: «Смотрите в прямом эфире» слева и «HuffPost Live» справа.

Еще одна причина, почему в этой ситуации действительно появляется красный цвет? Он дополняет зеленый цвет.

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

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

Третья причина: красный и зеленый часто «соревнуются» друг с другом за визуальное внимание, когда они соединены вместе, в результате чего оба цвета выглядят ярче, чем обычно (см. Слева).

Дизайнеры цветовой палитры HuffPost, безусловно, знали об этих явлениях, поэтому A) они очень экономно используют красный в дизайне, и B) они выбрали темный, ненасыщенный зеленый, который лучше сочетается с красным (см. Справа) .

Пример № 6: Глубокая насыщенность и основные цвета

С какого популярного веб-сайта взята палитра цветов ниже?

Прокрутите вниз, чтобы убедиться, что вы правы!

.

.

.

.

.

Первые несколько слов, которые приходят на ум при просмотре цветовой палитры BuzzFeed, включают «яркий», «яркий», «бросающийся в глаза» и «стоп-что-ты-делаешь-прямо сейчас-и-» прочти это-OMG-OMG-OMG !!! »

Очевидно, что цель BuzzFeed в этой цветовой палитре — привлечь наше внимание. Но что здесь происходит с точки зрения теории цвета?

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

Кроме того, если мы проигнорируем этот черный (который на самом деле не является цветом сам по себе, а скорее является результатом полного отсутствия — или полного поглощения — видимых световых волн), мы могли бы сказать, что BuzzFeed использует триаду. цветовая схема, так как красный, желтый и синий равномерно распределены по цветовому кругу.

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

Желтый, еще один важный цвет в палитре BuzzFeed, ассоциируется с энергией и счастьем. Кстати, о счастье … Разве этот ряд желтых кругов с черным текстом в верхней части домашней страницы BuzzFeed не напоминает вам ряд смайликов?

Синий цвет в цветовой палитре BuzzFeed зарезервирован исключительно для ссылок и кнопок с призывом к действию, что является разумным шагом. Понимаете, синий цвет ассоциируется со спокойствием и надежностью. Итак, среди всего эмоционального хаоса красно-желтого BuzzFeed синие ссылки кажутся привлекательными, как будто они говорят: «Не волнуйтесь, мы знаем, что здесь безумие, но вы можете нам доверять! Давайте, дайте нам щелчок! »

Урок № 7: Ненасыщенные палитры

Хорошо, пришло время для нашего последнего примера: с какого популярного веб-сайта взята палитра цветов ниже?

Прокрутите вниз, чтобы убедиться, что вы правы!

.

.

.

.

.

Если у вас возникли проблемы с определением того, что палитра, указанная выше, была взята из Facebook, не расстраивайтесь: я намеренно сделал ее немного сложной, включив красный и желтый.

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

Вот где сводится мой генеральный план: взгляните на цветовую палитру Facebook, затем прокрутите назад до BuzzFeed. Оба сайта используют желтый, красный и синий цвета в своих цветовых схемах … и все же схемы совершенно разные!

К настоящему моменту вы, вероятно, сможете объяснить, почему это так. Но давайте вместе пробежимся по нему ради забавы.

Для начала, Facebook использует несколько различных оттенков синего (как и Twitter). Это простой способ добавить контраста дизайну, не отклоняясь в совершенно ином стилистическом направлении.

Однако главный виновник здесь — насыщенность: желтый, красный и синий цвета Facebook ненасыщены в одинаковой степени. И в результате все они чувствуют себя спокойными и расслабленными. В то время как цветовая палитра BuzzFeed похожа на рюмку эспрессо, видя палитру Facebook, вы чувствуете себя завернутым в уютное одеяло.

Конечно, два сайта используют цвета по-разному. В BuzzFeed синий цвет, внушающий доверие и спокойствие, появляется только в ссылках.В Facebook есть фиксированная синяя полоса, проходящая прямо через верхнюю часть сайта, поэтому чувство доверия и спокойствия присутствует всегда.

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

Хотите поделиться некоторыми знаниями теории цвета? Отключите звук в разделе комментариев ниже!

Color Palette Explorer: 30 лучших цветовых схем для вашего дизайна

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

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

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

Палитры нейтральных цветов

Потертый шик, нейтральный

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

Ржаво-пастельные нейтральные

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

Элегантные мягкие нейтральные

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

Десертный оттенок, нейтральный

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

Палитры теплых цветов

Siesta Hour

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

Cosmopolitan

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

Звездный фейерверк

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

Цветовая палитра Торбьорна

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

Жирные ягоды

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

Мягкие цветовые палитры (Пастель)

Пастельная палитра экстремистских цветов

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

Ностальгическая мягкость

Эта пастельная цветовая палитра пробуждает женственность и нежность. Мягкое сочетание цветов от бледно-лавандового до зеленого создает плавное и дополняющее сочетание. Эта палитра идеальна для беззаботного контента, не перегружая его яркими цветами. Его можно найти на ColourLovers.

Оттенки сладкого зуба

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

Цветочный шипучий

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

Цветовая палитра Galaxy

Типичная галактика

Пурпурный цвет, признанный символом королевской власти, власти и благородства.Яркие оттенки этой палитры добавляют веселый и игривый оттенок сочетанию и подчеркивают зрелость фиолетового. Эта цветовая палитра галактики идеальна для сочетания изысканности и юности и ее можно найти на Color-hex.

Палитра цветов «Прищуриваясь ночью»

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

Палитра Sparkle Dew

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

Грозовой оттенок Дальянс

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

Элегантная цветовая палитра

Цветовая палитра Forma Silvestris

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

Monochrome Beauty

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

Греческий праздник

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

Элегантный и современный

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

Холодные цветовые палитры

Палитра цветов зеленого логотипа

Зеленый — цвет природы, символизирующий рост, гармонию и свежесть. Постепенное увеличение оттенка бледно-зеленого градиента создает плавность палитры, создавая мягкий и нежный тон. Эта цветовая палитра идеально подходит для контента, основанного на природе, и ее можно найти на Color-hex.

Аква Блюз

В этой цветовой палитре используются нежные темные цвета для создания таинственной и слегка мрачной атмосферы. Постепенное изменение тона от светлого тумана до павлиньего синего создает удобную и дополняющую комбинацию. Аква ассоциируется с эмоциональным исцелением и защитой и делает эту цветовую палитру идеальной для изысканного и успокаивающего контента. Его можно найти на Canva.

Палетка для макияжа Beachy Touch Cool

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

Вуди Дальянс

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

Живые цветовые палитры

Весенний отпуск

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

Спальня

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

Веселье и тропики

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

Палитра цветов Microsoft

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

Цветовая палитра Trickling

Красный олицетворяет силу, страсть и отвагу. Он также часто используется для привлечения внимания и предоставления срочной информации. Благодаря этой насыщенной красной цветовой палитре изображения и контент сразу же покидают страницу и привлекают внимание зрителя. Эта яркая, но мощная цветовая палитра идеальна для продвижения мощных посланий как предупреждения, так и любви, и ее можно найти на Color-hex.

Естественные цветовые палитры

Туманность Киля

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

Естественно элегантный

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

На открытом воздухе и на природе

Эта естественная цветовая палитра с оттенками зеленого и коричневого создает спокойное сочетание. Ярко-зеленый лайм добавляет энергии этому сочетанию цветов. Как следует из названия, эта цветовая палитра идеально подходит для экологически чистых и «зеленых» идей, и ее можно найти на Canva.

Garden Fresh

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

Игривые цветовые палитры (Детские / Живые)

Палитра цветов Crowdwish Final

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

Ночная жизнь

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

День и ночь

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

Счастливый подсолнух

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

Неоновые цветовые палитры

CMYK и палитра белого цвета

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

Цветовая палитра Always Sunset

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

Палитра неоновых огней города

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

Палитра Aqua Marine Neon

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

Шпаргалка по лучшим комбинациям цветов для вдохновения вашего дизайна

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

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

Не ждите, пока это сделает кто-то другой. Возьмите на работу себя и начните командовать.

Начни бесплатно

Основы сочетания цветов

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

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

Цветовое колесо

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

Как работает цветовое колесо?

Простое цветовое колесо состоит из 12 цветовых оттенков, расположенных вокруг центральной ступицы.

Цветовой круг, состоящий из основных, дополнительных и третичных цветов

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

Основные цвета выделены на цветовом круге

Смешивание равных частей любых двух основных цветов приводит к созданию дополнительных цветов.

• Красный + Синий = Пурпурный.
• Синий + желтый = зеленый.
• Красный + Желтый = Оранжевый.

Вторичные цвета, выделенные на цветовом круге

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

• Красный + Оранжевый = Красно-оранжевый.
• Желтый + Оранжевый = Желто-оранжевый.
• желтый + зеленый = желто-зеленый.
• Синий + Зеленый = Сине-зеленый.
• Синий + Пурпурный = Сине-фиолетовый.
• Красный + Пурпурный = Красно-фиолетовый.

Третичные цвета, выделенные на цветовом круге

Цветовая терминология

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

• Оттенок — Термины «цвет» и «оттенок» часто взаимозаменяемы художниками и дизайнерами. Во всех смыслах это поможет вам, но слова «цвет» и «оттенок» на самом деле означают разные вещи. В общем, «цвет» используется для обозначения всех цветов, включая черный, белый и серый.В то время как «оттенок» относится к происхождению цвета, который мы видим. Это базовый цвета, который мы видим, и он всегда является одним из шести основных и дополнительных цветов на цветовом круге.
• Оттенок — «Оттенок» — это более светлая версия данного оттенка. Это оттенок, к которому добавлено только белого. Иногда оттенок может казаться ярче, чем исходный оттенок, но это просто более бледная версия. Оттенок может варьироваться от оттенка, который чуть светлее оригинала, до почти белого с небольшим количеством цвета.
• Оттенок — Это противоположность «оттенку». «Тень» — это оттенок, к которому добавлен только черный цвет. Конечно, он может включать в себя разное количество черного, и результирующий цвет может быть чуть темнее исходного оттенка или может быть почти черным. Легкий способ запомнить это — подумать о том, как трава в оттенке дерева кажется темнее , чем трава на солнце.
• Тон — это очень похоже на «оттенок» и «оттенок», только вместо оттенка с добавлением белого или черного, это оттенок с добавлением только серого.Серый цвет, добавляемый для создания «тона», должен состоять только из черного и белого, никаких других цветов (многие цвета, которые считаются серыми, на самом деле имеют основу, которая является оттенком). Тонированные цвета обычно считаются более изысканными, чем чистые оттенки.
• Теплые в сравнении с холодными. «Теплые» цвета — это те, которые напоминают или символизируют тепло, в то время как «холодные» цвета относятся к льду и более низким температурам. Например: красный, оранжевый, желтый и красно-фиолетовый — теплые цвета, а синий, фиолетовый, зеленый и сине-зеленый — холодные цвета.

Психология цвета

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

«Цвет — это сила, непосредственно влияющая на душу». ~ Василий Кандинский

Ниже приводится краткое изложение различных оттенков и чувств, которые они часто вызывают:

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

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

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

Теперь, когда у нас есть понимание цвета применительно к искусству и дизайну, давайте перейдем к интересным вещам…

Цветовые комбинации

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

Монохромные комбинации

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

Дополнительные комбинации

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

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

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

Примеры дополнительных цветовых сочетаний:

• Красный и зеленый.
• Синий и оранжевый.
• Желтый и фиолетовый.
• Желто-зеленый и красно-фиолетовый.
• Красно-оранжевый и сине-зеленый.

Выше пример дополнительной комбинации: синий и оранжевый. Обратите внимание на то, как они расположены прямо напротив друг друга на цветовом круге.

Аналогичные комбинации

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

Примеров аналогичных комбинаций:

• Фиолетовый, синий и бирюзовый.
• Красный, фуксия и пурпурный.
• Красный, оранжевый и желтый.
• Зеленый, синий и фиолетовый.

Разделенные дополнительные комбинации

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

Примеры разделенных дополнительных цветовых схем:

• Красный, сине-зеленый и желто-зеленый.
• Синий, красно-оранжевый и желто-оранжевый.
• Желтый, сине-фиолетовый и красно-фиолетовый.
• Фиолетовый, желто-оранжевый и желто-зеленый.

Триадические комбинации

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

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

Примеры триадных комбинаций:

• Красный, желтый и синий.
• Пурпурный, зеленый и оранжевый.
• Сине-фиолетовый, красно-оранжевый и желто-зеленый.

Тетрадические комбинации

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

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

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

• Красный, зеленый, сине-фиолетовый и желто-оранжевый.
• Желтый, фиолетовый, сине-зеленый и красно-оранжевый.

Ключ к экспериментам

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

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

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

Наши любимые комбинации

Монохромный

Искусство Кимберли Рашель .Цветовые палитры из Canva .

Дополнительный

Искусство Кимберли Рашель . Цветовые палитры из Canva .

Аналог

Цветовые палитры из Canva .

Сплит

Искусство Кимберли Рашель .Цветовые палитры из Canva .

Триадический

Искусство Кимберли Рашель . Цветовые палитры из Canva .

Тетрадик

Цветовые палитры из Canva .

Хотите узнать больше?

Есть какие-нибудь красочные советы или собственные хитрости? Нам бы очень хотелось их услышать.Дайте нам знать об этом в комментариях!

идей свадебной цветовой палитры, которые вдохновят вас

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

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

Многие невесты начинают процесс планирования, имея в виду хотя бы один цвет, но если вы не знаете, как его использовать, обратите внимание на другие элементы вашего торжества, чтобы дополнить остальную часть вашей палитры. В какое время года вы выходите замуж? Глубокие тона драгоценных камней подходят для зимних праздников, мягкая зелень — для весны, а теплая ржавчина говорит о осени. Еще один источник цветового вдохновения — это ваше заведение. У вас свадьба на Санторини, Греция? Рассмотрим бело-голубую палитру.В качестве альтернативы свадьба на берегу океана в южной Калифорнии будет прекрасна с нотками сливок, персика и шалфея.

No related posts.