Содержание

18 полезных ресурсов для работы с цветом

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

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

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

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

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

Ресурс HTML Color Codes предоставляет вам весь набор инструментов для работы с цветами в Web: переводы из одного цветового представления в другое, color picker, color chart и даже много туториалов про цвета.

Очень круто.

Роскошный онлайн-инструмент для работы с цветом! Палитры, цвета, паттерны, все настраивается, выкладывается, делится и вычисляется из заданной картинки! Удобнее colorlovers в некоторых аспектах, более гибкий, чем kuler! Восторг, господа!)

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

24 сочных градиента от дизайнера Luke Davies.

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

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

Это один из инструментов, который всегда должен быть под рукой у дизайнера, а на Color by Hailpixel определенно стоит обратить внимание. Открывшийся сайт покажет вам пустой экран с единственной ссылкой на черный цвет (#000000). Перемещая курсор по экрану, вы будете видеть, как изменяется цвет фона, а окошко в центре будет показывать соответствующий hex-код этого цвета. Клик мышью создаст полоску текущего цвета с цифровым значением этого цвета.

Используя приложение, вы можете быстро увидеть многоаспектный характер цветов и отношения между цветами. Цвета палитрый представлены в 3d виде. Созданные палитры могут быть импортированы или экспортированы в Adobe Swatch Exchange (ASE). В ColoRotate есть свое сообщество, где можно просмотреть темы, созданные другими пользователями.

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

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

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

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

Абсолютно бесплатно и, что наиболее важно – онлайн, позволяет создавать и сохранять гармоничные цветовые сочетания, как автоматически, так и вручную. Пользуясь тремя ползунками RGB или HSV вы автоматически получаете гармоничное сочетание из шести цветов и затем можете настраивать их в соответствии со своим вкусом. Цвета автоматически представляются в виде цветового HTML кода и кода RGB, а также могут быть экспортированы в виде цветовых таблиц Photoshop (. ACT) и Illustrator (.EPS). Кроме того, есть функция сравнения цвета со стандартным понтонным. Свои палитры можно хранить прямо на сайте, задавая им удобные вам имена. Также на сайте можно найти массу готовых палитр на разные случаи жизни.

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

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

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

Фото на обложке: ShutterStock

10 бесплатных инструментов, чтобы подобрать цветовую гамму для стартапа

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

1. Color Explorer


Color Explorer – один из самых полезных инструментов для подбора цветовых схем и сочетаний. Позволяет на основе одного базового цвета подобрать релевантную цветовую гамму и разные оттенки, а также проанализировать потенциальную конверсию для разных типов цветовой схемы. Еще позволяет составлять цветовые схемы на основе выбранных изображений, импортировать css/html код из файлов и работать с RGB и hex-кодировкой цветов.

2. Adobe Kuler


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

3. Slayeroffice Color Palette Generator


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

4. ColorBlender


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

5. 0 to 255


0 to 255 – еще один «подборщик» фильтров, при помощи которого можно взять и получить темные / светлые оттенки цветов. Для тех, кто увлекается градиентами и тенями – самое то.

6. Colorspire


Если все предыдущие инструменты вам почему-то не подошли – попробуйте Сolorspire. В нем еще есть настройка сатурации и всякие быстрые настройки выбранного цвета.

7. Color Schemer


Этот инструмент предлагает палитру из 16 цветов (в большинстве предыдущих вариантов базовых цветов 5). Еще его можно использовать без подключения к интернету на Mac или PC.

8. Color hunter


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

9. ColorCombos


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

10. WebAIM


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

25 лучших сервисов для работы с цветом

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

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

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

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

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

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

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

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

Если вы нашли веб-сайт, цветовое оформление которого вам понравилось, при помощи онлайн-сервиса Web Colour Data можно составить цветовую палитру: достаточно просто ввести адрес. Узнать можно не только цветовое наполнение, но и процентное соотношение каждого из цветов. Для примера на главной странице представлены палитры известных сайтов (Google, Pinterest, WordPress и др.).

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

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

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

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

Заняться самой настоящей охотой за цветом можно на сайте Color Hunter. Сервис достаточно простой: доступен поиск по тегам или HEX-коду, а также есть возможность загрузить изображение и “разложить” его на цвета.

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

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

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

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

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

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

Инструмент для выбора цвета в стиле Material Design. Возможность в один клик копировать HEX- или RGB-код можно назвать одним из преимуществ сервиса.

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

Коллекция градиентов, цветовых кругов и двухцветных палитр.

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

Приложение, которым пользуются даже в таких известных компаниях как Amazon, Twitter и Pinterest, наверняка станет неплохим подспорьем при создании палитры. Правда, некоторые барьеры есть: доступен данный инструмент только на Mac или iPhone.

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

Простая и удобная галерея палитр и цветов от датского дизайнера Тристана Уайта.

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

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

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

Восприятие любого веб-проекта зависит от нескольких факторов, к таковым можно отнести:

— целостность картины, единство контента и дизайна;

— психологическое и физиологическое состояние посетителя;

— оформление дополнительных элементов дизайна;

— шрифты, используемые для текстов;

— цветовая гамма и т.д.

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

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

1. Цвета должны соответствовать тематике сайта и фирменному стилю (если таковой имеется). 

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

3. Количество основных цветов на сайте должно быть не более трех.

4. Цвета должны быть подобраны с учетом возрастной категории посетителей.

5. Цвет шрифта должен быть четким и удобно читаемым.

6. Цвета дополнительных элементов должны вписываться в общий дизайн.

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

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

5 лучших сервисов для подбора цветовой схемы

Цвет является мощным инструментом, который может умело рассказать целую историю. От него зависит первое впечатление, которое получит пользователь от продукта, а это в свою очередь повлияет на его выбор: пользоваться им или нет. Именно поэтому мы подобрали для вас 5 полезных сервисов с готовыми цветовыми наборами, которые помогут подобрать наилучшую сочетаемость оттенков.
1. Color Hunt
https://colorhunt.co

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

2. Color Leap
https://colorleap.app

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

3. Khroma
http://khroma.co

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




4. Culrs https://culrs.com/#/

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

Нажав на имя конкретной палитры в Culrs, URL-адрес меняется на пользовательский и вы можете поделиться ею с кем угодно!

5. Coolorshttps://coolors.co

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

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


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

Подбор цветовой гаммы для сайта

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

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

Основные, первичные цвета (primary) – это красный, желтый и синий.

Вторичные цвета (secondary) получаются методом смешивания пары основных цветов. Это оранжевый, зеленый и пурпурный цвета.

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

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

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

Основные цветовые схемы.

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

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

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

Альтернативный комплемент.

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

Расщепленный комплемент.

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

Особенности самых популярных цветов.

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

Красный
Цвет обладает возбуждающим эффектом и может вызвать чувство тревоги, но его оттенки (например, коричневый) могут оказывать успокаивающее воздействие на человека. Не следует злоупотреблять ярко красным цветом, так как это быстро утомит пользователя.
Желтый
Позволяет с легкостью создать атмосферу оптимизма и радости. Это очень энергичный цвет, который рекомендуется использовать для оформления сайтов, тематика которых напрямую связана с развлечениями или другими видами активности пользователей.
Голубой
Наиболее предпочтительный цвет для тех случаев, когда необходимо вызвать чувство надежности и стабильности. Является оттенком синего цвета (аналогичен ему) и с успехом может применяться для выражения чистоты и покоя.
Зеленый
Цвет вызывает чувство гармонии, безопасности и жизни. Этот цвет является вторичным и получается в результате сочетания двух первичных цветов – желтого и синего. Может иметь как теплые, так и холодные оттенки.
Черный
Придает черты элегантности и изысканности оформлению внешнего вида сайта, позволяет путем комбинации его оттенков увеличить перспективу и глубину восприятия. Необходимо с большой осторожностью подходить к дизайну с использованием черного цвета, так как при его избыточности или неправильной комбинации его оттенков, он способен вызвать чувство тоски, горечи и дискомфорта.
Белый
Ассоциируется с чувством свободы, легкости и чистоты. Основное предназначение этого цвета – это создание фона. Белый цвет прекрасно сочетается со всеми остальными оттенками.

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

Post Views: 706

как создать идеальную цветовую схему – Сей-Хай

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

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

Терминология

  • Оттенок (Hue): какого цвета что-то – синий или красный;
  • Интенсивность цвета (Chroma): насколько чистый цвет;
  • Насыщенность (Saturation): «сочность» цвета;
  • Насыщенность цветового тона (Value): насколько светлый или темный цвет;
  • Тон (Tone): создается путем добавления серого к чистому оттенку;
  • Тень (Shade): создается путем добавления черного к чистому оттенку;
  • Светлый оттенок (Tint): создается путем добавления белого к оттенку.
Наглядный пример, как получается тот или иной оттенок.

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

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

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

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

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

Общепринятые значения цветов

  • Красный: энергия, сила, страсть;
  • Оранжевый: радость, энтузиазм, креативность;
  • Желтый: счастье, интеллект, энергия;
  • Зеленый: амбиции, рост, безопасность;
  • Синий: спокойствие, уверенность;
  • Фиолетовый: роскошь, амбиции, креативность;
  • Черный: сила, элегантность, тайна;
  • Белый: чистота, совершенство.

Уточнение о доступности

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

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

3 совета для начала

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

Используйте правило 60-30-10. 60% – доминирующий оттенок, 30% – вторичный цвет, а 10% – акцентный. Это старое правило из дизайна интерьера поможет сбалансировать ваши цвета. Формула работает, потому что позволяет глазу удобно перемещаться от одного фокуса к другому. Даже если ваша палитра содержит более трех цветов (но, пожалуйста, не более пяти), стоит сохранять баланс. Так глазам будет проще, а мозгу удобнее.

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

3 инструмента, которые прокачают вашу палитру

Color Hunt – это «бесплатная и открытая платформа для вдохновения. Здесь можно найти тысячи специально подобранных цветовых палитр». Это отличный способ найти подходящую палитру.

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

Paletton – инструмент похож одновременно на Coolors и Color CC. Разница в том, что вы не ограничены только 5 оттенками. Этот инструмент отлично подойдет, если у вас есть основной цвет и вы хотите найти дополнительные тона. Отличный инструмент для изучения всех палитр, о которых мы говорили выше.

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

Эксперименты от Google: подбор палитры по фото

Как найти идеальную цветовую пару

Тест: «Определи цвет по его названию»

Источник: Inside Design

Как выбрать цветовую палитру для создания идеальной цветовой схемы

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

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

Основы теории цвета

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

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

  • Оттенок : какого цвета что-то, типа синего или красного
  • Chroma : насколько чистый цвет; к этому добавилось отсутствие белого, черного или серого
  • Насыщенность : сила или слабость цвета
  • Значение : насколько светлый или темный цвет
  • Тон : создается путем добавления серого к чистому оттенку
  • Оттенок : создается путем добавления черного к чистому оттенку
  • Оттенок : создается путем добавления белого к оттенку

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

    • Монохромный : разные оттенки и глубины одного оттенка. Это могут быть самые простые цветовые схемы, поскольку все они взяты из одного цвета. Это затрудняет (но не делает невозможным) создание резкой или уродливой схемы. Однако будьте осторожны; однотонные палитры могут быть скучными, если их сделать плохо.
    • Аналог : основной цвет и цвета по обе стороны от него на цветовом круге. Эти палитры обычно отлично отражают согласованность и единообразие дизайна. С ними также легко работать, потому что нет большой разницы в оттенках.Вместо этого контраст достигается прежде всего за счет вариаций цветового оттенка, ограничивая любое отвлечение от контента.
    • Дополнительные : Дополнительные или противоположные цвета цветового круга (например, красный и зеленый, синий и оранжевый и т. Д.). Дополнительные палитры отлично подходят для передачи чувства баланса. Подобно аналогичным палитрам, добавление различных оттенков и оттенков может расширить эти схемы. Это особенно полезно для предотвращения яркого контраста, который может вызвать утомление глаз, когда два противоположных цвета помещаются рядом друг с другом.
    • Triadic : три цвета из равноудаленных точек на цветовом круге (например, красный, желтый и синий). Триадический метод создает более разнообразную палитру. Это требует немного большего планирования и экспериментов, потому что включает большее количество оттенков, которые противопоставляются друг другу.

Что означают цвета

  • Красный : энергия, сила, страсть
  • Апельсин : радость, энтузиазм, творчество
  • Желтый : счастье, интеллект, энергия
  • Зеленый : амбиции, рост, свежесть, безопасность
  • Синий : спокойствие, уверенность, интеллект
  • Purple : роскошь, амбиции, креативность
  • Черный : сила, элегантность, загадка
  • Белый : чистота, чистота, совершенство

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

Примечание о доступности

Одна из проблем, о которой должны помнить дизайнеры UX, — это удовлетворение потребностей посетителей сайта с дальтонизмом или дефицитом цветового зрения (ССЗ). Этим заболеванием страдают более восьми процентов мужчин и около 0,5 процента женщин североевропейского происхождения. Дизайнеры UX должны использовать палитры для дальтонизма, адаптированные и сконфигурированные для соответствия множеству разновидностей дальтонизма. Ознакомьтесь с этим сообщением команды разработчиков Pinterest о том, как они подходят к доступности CVD на своей преимущественно визуальной платформе.

3 совета для начала работы

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

Используйте правило 60-30-10. Используйте свои цвета в пропорции 60% + 30% + 10%.Это старое правило дизайна интерьера призвано сбалансировать ваши цвета. Формула работает, потому что позволяет глазу комфортно перемещаться от одной точки фокусировки к другой. Он также невероятно прост в использовании: 60% — ваш доминирующий оттенок, 30% — ваш вторичный цвет и 10% — это акцентный цвет. Даже если в вашей палитре более трех цветов (но, пожалуйста, не более пяти), балансировка будет более приятной для глаз и более удобной для мозга пользователей.

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

Связано: смотрите тенденции цветовых палитр на Dribbble с этой новой платформой

3 цветных инструмента, которые улучшат вашу палитру

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

Coolors.co — Этот инструмент представляет собой «сверхбыстрый генератор цветовых схем для крутых дизайнеров». Существует приложение для iOS вместе с надстройками Adobe для Photoshop и Illustrator. Вы можете просматривать тысячи цветовых палитр от сообщества, сохранять и получать доступ к своим любимым цветовым палитрам практически отовсюду и использовать их в своих проектах всего несколькими щелчками мыши.

Paletton — похож на Coolors и Color CC, с той разницей, что вы не ограничены только 5 тонами.Это отличный инструмент, который можно использовать, когда у вас есть основные цвета и вы хотите изучить дополнительные тона. Если вы хотите изучить все типы цветовых палитр, о которых мы говорили выше, это отличный инструмент, чтобы узнать о них.

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

Руководство дизайнера по теории цвета, цветовым кругам и цветовым схемам

Когда вы просматриваете ленту новостей, что привлекает ваше внимание? Скорее всего, это видео с YouTube, картинки, анимированные GIF-файлы и другой визуальный контент, верно?

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

Я знаю, о чем вы можете подумать: «Я не знаю, как создавать потрясающие визуальные эффекты. Я не творческий человек».

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

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

И вы можете сделать это, изучив теорию цвета. Считайте это своим вводным курсом, и мы рассмотрим следующие темы:

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

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

Почему теория цвета важна в веб-дизайне?

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

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

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

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

Теория цвета 101

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

Помните, что слышали о первичных, вторичных и третичных цветах? Они очень важны, если вы хотите понять все остальное о цвете.

Основные цвета

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

Есть три основных цвета:

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

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

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

Дополнительные цвета

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

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

  • Красный + желтый = Оранжевый
  • Синий + Красный = Фиолетовый
  • желтый + синий = зеленый

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

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

Третичные цвета создаются при смешивании основного цвета со второстепенным.

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

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

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

  • Красный + фиолетовый = Красно-фиолетовый (пурпурный)
  • красный + оранжевый = красно-оранжевый (киноварь)
  • Синий + фиолетовый = Сине-фиолетовый (фиолетовый)
  • Синий + зеленый = Сине-зеленый (бирюзовый)
  • желтый + оранжевый = желто-оранжевый (янтарный)
  • Желтый + зеленый = Желто-зеленый (шартрез)

Колесо теории цвета

Хорошо, отлично. Итак, теперь вы знаете, что такое «основные» цвета, но мы с вами оба знаем, что выбор цветовых комбинаций, особенно на компьютере, предполагает гораздо более широкий диапазон, чем 12 основных цветов.

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

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

оттенок

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

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

Если бы вы смешали, например, оттенки красного и синего, вы бы получили фиолетовый, верно? Но смешайте оттенок красного цвета с оттенком синего, и вы получите взамен слегка окрашенный фиолетовый.

оттенок

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

Оттенок

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

Тон (или насыщенность)

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

Аддитивная и субтрактивная теория цвета

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

Вы когда-нибудь задумывались, что означают эти буквы?

CMYK

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

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

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

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

Мне легче думать о CMYK с точки зрения соответствующих ему чисел. CMYK работает по шкале от 0 до 100. Если C = 100, M = 100, Y = 100 и K = 100, вы получите черный цвет. Но если все четыре цвета равны 0, вы получите настоящий белый цвет.

RGB

Цветовые модели

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

RGB означает красный, зеленый, синий и основан на аддитивной цветовой модели световых волн .Это означает, что чем больше цвета вы добавите , , тем ближе вы будете к белому. Для компьютеров RGB создается с использованием шкалы от 0 до 255. Таким образом, черный цвет будет R = 0, G = 0 и B = 0. Белый цвет будет R = 255, G = 255 и B = 255.

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

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

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

Как выбрать цветовую схему

  1. Учитывайте свой цветовой контекст.
  2. Для определения аналогичных цветов обратитесь к цветовому кругу.
  3. Для определения дополнительных цветов обратитесь к цветовому кругу.
  4. Сделайте акцент на однотонных цветах одного оттенка.
  5. Используйте тройную цветовую схему для создания высокой контрастности.
  6. Создайте разделенную дополнительную цветовую схему.
  7. Не ограничивайтесь предустановками, но начните с одного цвета.

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

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

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

1. Учитывайте свой цветовой контекст.

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

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

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

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

Однако выбрать цвета с высокой контрастностью не всегда так сложно, как выбрать цвета, которые хорошо смотрятся вместе.

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

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

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

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

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

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

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

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

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

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

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

Дополнительная цветовая схема также отлично подходит для диаграмм и графиков. Высокая контрастность помогает выделить важные моменты и выводы.

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

4. Сосредоточьтесь на монохромных цветах одного оттенка.

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

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

Обратите внимание на все монохромные цвета, которые подпадают под красный оттенок, основной цвет.

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

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

Цветовые схемы

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

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

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

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

6. Создайте разделенную дополнительную цветовую схему.

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

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

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

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

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

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

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

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

7. Не ограничивайтесь предустановками, но начните с одного цвета.

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

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

Инструменты цвета

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

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

Adobe Color

Один из моих любимых цветных инструментов, которые я использую при разработке чего-либо — будь то инфографика или просто круговая диаграмма — это Adobe Color (ранее Adobe Kuler).

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

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

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

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

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

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

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

Руководства по предустановленным цветам

Если вы не являетесь пользователем Adobe, вероятно, вы хотя бы раз пользовались продуктами Microsoft Office. Во всех продуктах Office есть предустановленные цвета, которые вы можете использовать и экспериментировать для создания цветовых схем. В PowerPoint также есть несколько предустановок цветовой схемы, которые вы можете использовать для вдохновения в своих проектах.

Расположение цветовых схем в PowerPoint будет зависеть от того, какую версию вы используете, но как только вы найдете цветовые «темы» своего документа, вы можете открыть настройки и найти коды RGB и HEX для используемых цветов.

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

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

Примечание редактора: этот пост был первоначально опубликован в октябре 2018 года и был обновлен для полноты.

15 дизайнерских приемов для выбора идеальной цветовой палитры

Выберите цвет, любой цвет

Выберите цветовую схему из самого большого узора в пространстве

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

Украшать от темного к светлому, вертикально

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

Начните с формальных помещений дома

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

Используйте цветовое колесо

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

Ориентируйтесь на свою одежду

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

Назад к черному

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

Идти с серыми

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

Используйте правило 60-30-10

«При оформлении пространства разделите цвета на составляющие: 60 процентов доминирующего цвета (стены), 30 процентов второстепенного цвета (обивка) и 10 процентов акцентного цвета (аксессуары)», — советует дизайнер Марк МакКоли. «Работает каждый раз!» он говорит. «Это соотношение гарантирует, что цвета будут правильно сбалансированы, а поп-музыки будет достаточно для интереса».

Сделайте небольшие пространства популярными

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

Контраст теплого и холодного

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

Положитесь на вечное сочетание

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

Создайте монохромный образ

Сделайте акцент на своем любимом цвете, заполнив небольшое пространство, например, ванную комнату, именно этим оттенком. Здесь дизайнер Джудит Балис создала жизнерадостную ванную комнату в консервативном цвете Келли-зеленый. Насыщенный оттенок, сбалансированный с белыми стенами и полом, привлекает внимание, но не подавляет.

Следуйте правилу трех

Продемонстрируйте свой личный стиль

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

цветовых схем | Как правильно выбрать цветовую комбинацию

Раскрась свой мир, смело

Большинство из нас понимают основы цветового круга: от основных и вторичных цветов до того, как определенные цветовые комбинации работают вместе.Однако то, как вы интерпретируете цветовое колесо, может быть намного больше, чем просто умение смешивать и смешивать красный, желтый, синий, оранжевый, фиолетовый и зеленый. Знание различных цветовых схем помогает расширить наши знания о цвете. И это важно для творческих людей, таких как художники и дизайнеры. Ниже художница Патти Моллика описывает некоторые из наиболее распространенных цветовых схем. Она также быстро демонстрирует, как разные цветовые схемы влияют на одну и ту же композицию, из ее новой книги How to Paint Fast Loose and Bold . Наслаждайтесь!

Цветовой круг с первичными, вторичными и третичными оттенками; основные цвета: синий, желтый и красный; вторичные цвета включают: оранжевый, фиолетовый и зеленый; и третичные цвета включают: желто-оранжевый, красно-оранжевый, красно-фиолетовый, сине-фиолетовый, сине-зеленый и желто-зеленый.

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

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

  • Оттенок : цвет, который был осветлен добавлением белого.
  • Оттенок: Цвет краски в том виде, в котором она находится вне тюбика, без смешивания.
  • Тон: Цвет, который был осветлен или затемнен за счет добавления серого.
  • Оттенок: Цвет, затемненный за счет добавления черного.

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

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

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

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

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

Гарри, Мо и Кудряшка Патти Моллика, масло на панели; пример аналогичной цветовой схемы

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

«Вид на мост». Автор: Патти Моллика, масло на панели; пример однотонной цветовой схемы

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

One Slacker от Патти Моллика, акрил на панели; пример триадной цветовой схемы

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

Two-Lips от Patty Mollica, акрил на панели; пример дополнительной цветовой схемы

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

Верхний Вест-Сайд, Патти Моллика, холст, акрил; пример квадратной цветовой схемы

Тетрадная (или прямоугольная) цветовая схема использует четыре цвета, состоящие из двух дополнительных цветов.

Пересечение Мэдисона Патти Моллика, акрил на панели; пример цветовой схемы тетрад

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

Dunkin ’Donuts Патти Моллика, холст, акрил; пример разделенной дополнительной цветовой схемы

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

«В поисках города» Патти Моллика, акрил на панели; пример аналогичной дополнительной цветовой схемы

Разработка цветовой схемы

Давайте исследуем способ создания цветовой схемы.

1. Начните с фото ссылки

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

2. Создайте трехзначный эскиз

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

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

3. Выберите цветовую схему с доминирующими и второстепенными цветами

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

  1. Аналог: Зеленый и синий
  2. Дополняющий: Красный и зеленый
  3. Триада: Основные цвета — красный, желтый и синий
  4. Аналогичный Дополняющий: Синий и фиолетовый, желтый и оранжевый

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

Хотите более смелые картины?

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

Лучшие цветовые палитры веб-сайтов для повышения вовлеченности (2020)

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

У всех есть любимые цвета, к которым они стремятся, когда дело касается работы или чего-то еще.

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

Хороший выбор цвета требует тщательного планирования.

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

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

Почему ваша цветовая схема так важна?

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

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

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

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

Вот как:

1. Обеспечение узнаваемости бренда

Ваш сайт — это, по сути, дом вашей компании в Интернете.

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

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

К счастью, цвет повышает узнаваемость бренда на 80%.

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

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

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

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

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

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

2. Сформируйте отношение посетителей к вашему сайту

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

В определенной степени причина этого ясна.

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

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

Многие компании пользуются этими связями, как показано логотипами на следующей диаграмме.

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

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

В одном исследовании личности бренда психолог и профессор Стэнфордского университета Дженнифер Аакер пришла к выводу, что пять основных параметров играют роль в индивидуальности бренда:

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

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

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

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

Например, синий часто считается самым безопасным выбором.Отчасти это связано с тем, что это самый распространенный «любимый» цвет среди большинства населения.

На самом деле 57% мужчин и 35% женщин считают, что это их любимый цвет.

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

Также стоит отметить, что синий цвет также часто ассоциируется с чувством доверия, авторитета и надежности.

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

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

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

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

3. Развивайте чувство порядка

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Триадная цветовая схема — один из основных вариантов.

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

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

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

4.Выделение определенных элементов

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

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

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

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

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

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

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

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

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

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

5. Упростите конструкторские решения

Когда дело доходит до ведения веб-сайта или бизнеса (или того и другого!), Всегда полезно искать способы упростить основные процессы.

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

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

Это особенно верно, если вы потратите время на документирование своей палитры простым в использовании способом, как в этом бизнесе:

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

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

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

Сколько цветов нужно добавить?

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

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

Как выбрать цветовую схему веб-сайта

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

Как мы все знаем, создание прочной торговой марки жизненно важно.

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

А что является неотъемлемой частью бренда?

Его логотип.

Цветовая гамма, которую компания выбирает для своего логотипа, навсегда переплетается с ее фирменным стилем.

Согласно исследованию, «Цвет увеличивает узнаваемость бренда на 80 процентов.”

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

Есть еще кое-что, о чем нужно помнить. Цвет бренда коррелирует со значением бренда .

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

Ценные бренды заботятся о цвете . Много!

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

Взгляните на эти примеры с сайта TheLogoFactory.com

Вы можете мгновенно обнаружить искусственные логотипы, и вы почувствуете что-то другое, окружающее этот бренд!

Цветовая схема сайта

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

Вы не хотите выбирать цветовую схему наугад или основывать ее на том, «что вам нравится».

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

Почему?

«Люди подсознательно судят об окружающей среде или продукте в течение 90 секунд после первого просмотра. От 62 до 90 процентов этой оценки основано только на цвете ».

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

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

1. Понять, как цвет влияет на эмоции

Первое, что я рекомендую, — это ознакомиться с тем, как цвет влияет на человека на эмоциональном уровне.

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

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

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

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

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

2. Учитывайте общую демографию

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

С кем вы пытаетесь связаться и продать?

Какие эмоции вы пытаетесь вызвать?

Это чрезвычайно важные вопросы, которые стоит задать себе.

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

Учитывайте личность и эмоции вашей целевой аудитории.

Затем выберите лучший цвет, который будет основным цветом для цветовой схемы вашего веб-сайта.

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

3. Учитывать пол

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

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

Исследование, проведенное на основе Color Assignments Джо Хэллока, показало, что в среднем каждый пол имеет определенные цветовые предпочтения.

Вот что я имею в виду.

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

Женщины любят синий и фиолетовый и не любят коричневый и оранжевый.

Это еще один фактор, о котором следует помнить.

4. Рассмотрим возрастную группу

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

Знаете ли вы, что цветовые предпочтения человека могут меняться с возрастом?

Согласно исследованию Джо Хэллока, это правда.

Вот любимые цвета людей по возрастным группам.

Вот наименее любимый цвет людей по возрастным группам.

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

5. Пройдите «Цветную викторину»

Если вам нужна небольшая помощь в выборе основного цвета, вы можете пройти этот тест от Grasshopper.

Он спросит вас, например, «что лучше всего описывает ваших клиентов» и «какой тип продукта вы предлагаете».

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

6. Избавьтесь от предубеждений

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

И это на основании их личных предпочтений, а не психологии.

Если ваш любимый цвет — синий, очень заманчиво сделать синий своим основным цветом.

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

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

7. Решите, сколько цветов использовать

Итак, на этом этапе вы должны иметь в виду основной цвет.

Теперь пора выяснить, сколько всего цветов вы хотите использовать.

Хотя для этого не существует универсальной формулы, я хотел бы указать на то, что называется правилом 60-30-10.

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

Вот как все это ломается.

  • 60 процентов доминирующего цвета
  • 30 процентов вторичного цвета
  • 10 процентов акцентного цвета

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

Если вам нужен пример правила 60-30-10, не ищите ничего, кроме Quick Sprout.

Обратите внимание на то, что зеленый является основным цветом, белый — второстепенным, а черный — основным.

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

Три.

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

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

8. Выберите цветовой набор

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

Я не эксперт в области дизайна, но вы обязательно захотите добиться контраста.

Лично я предпочитаю сайты со светлым фоном и более темными контрастами на переднем плане.

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

Вот хороший пример.

Однако есть сайты, которые неплохо справляются с темным фоном.

Возьмем, к примеру, «Чудо-хлеб».

9. Проконсультируйтесь с цветовым кругом

Помните, в классе рисования вы узнали о «цветовом круге»?

Что ж, это может быть огромным подспорьем при выборе цветовой схемы сайта.

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

Вот о чем я.

Один из возможных вариантов дополнительных цветов — желтый и фиолетовый.

Другой будет зелено-оранжевым.

Один из вариантов аналогичных цветов — оранжевый и красный.

Другой будет зелено-синим.

10. Используйте вспомогательные инструменты

Вот совет по оптимизации процесса.

Используйте такой инструмент, как Colorspire.

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

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

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

11. Примите участие в конкурсе

Вы также можете многому научиться у конкурентов в вашей отрасли.

Я рекомендую проверить как минимум три веб-сайта прямых конкурентов и найти общие закономерности в их цветовой гамме.

Это должно дать вам представление о том, какие типы тонов они используют.

Оттуда у вас есть один из двух вариантов.

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

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

12. Сравните несколько разных цветовых схем

Вот в чем дело.

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

На самом деле, это может быть очень ограничивающим фактором.

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

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

Затем сузьте круг, пока не найдете цветовую схему, соответствующую вашему бренду, на T.

Заключение

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

Это просто вопрос понимания психологии цвета и эмоций, которые вызывают различные цвета.

Вы также захотите получить базовое представление о правиле 60-30-10 и о том, как работает цветовое колесо.

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

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

Все это может иметь огромное влияние на ваш бизнес.

Какие факторы вы принимаете во внимание при выборе цветовой схемы?

Узнайте, как мое агентство может привлечь огромное количество трафика на ваш веб-сайт

  • SEO — разблокируйте огромное количество SEO-трафика. Смотрите реальные результаты.
  • Контент-маркетинг — наша команда создает эпический контент, которым будут делиться, получать ссылки и привлекать трафик.
  • Paid Media — эффективные платные стратегии с четким ROI.

Заказать звонок

Как выбрать правильную цветовую палитру для вашего дома

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

mikehutch50 / Twenty20

Выбираем цвета

Начните с работы с цветовым кругом.Есть первичные, вторичные и третичные цвета.

Мгновенно получайте скидки на предметы интерьера!

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

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

Photographee.eu/ Shutterstock

Создание вашей цветовой схемы

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

  1. Монохроматический. В монохромной цветовой схеме используется тон в тон одного цвета с добавлением белого или черного для осветления или затемнения цвета. Например, в этой схеме синий может стать бледно-голубым или темно-синим, и для создания этого эффекта используются все три оттенка одного оттенка.
  2. Аналог. В аналогичной схеме используются цвета, которые появляются рядом друг с другом на цветовом круге. Например, желтый будет использоваться с зеленым или оранжевым, или синий будет использоваться с зеленым или фиолетовым. Это создает красочную и часто успокаивающую палитру.
  3. Контраст. Контрастная схема более драматична. Здесь используется триада контрастных цветов: желто-оранжевый, зелено-синий и красно-фиолетовый. Это привнесет больше цвета и энергии в палитру вашего дома.
  4. Дополнительный. Наконец, у нас есть дополнительная схема, в которой два противоположных цвета, такие как синий и оранжевый, используются вместе для создания драматической, смелой и высокоэнергетической цветовой схемы.

Создание вашей цветовой схемы

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

Что необходимо учитывать

Photographee.eu/ Shutterstock

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

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

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

Освещение

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

Обязательства

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

С чего начать цвет

kane251 / Twenty20

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

Отделить верхний этаж от нижнего

Корневамаха / Твенти20

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

.