Палитры цветов для дизайнеров: 8 сайтов с палитрами — Каждый пиксель важен

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

Цвет! До чего богатый и таинственный язык, язык снов!

Поль Гоген

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

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

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

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

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

1. Ищите вдохновение в окружающем мире

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

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

2. Используйте цветовой круг

Когда художник Марк Шагал работал с цветовыми палитрами, он придерживался простого правила: «Цвета дружат со своими соседями и любят противоположности».

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

Синди Кинаш (Cindy Kinash), дизайнер из Cultivated Mind, считает, что при создании акварельных цветов тени следует наносить аналоговым цветом.

В этом проекте Синди Кинаш светло-синий соседствует с темно-синим и пурпурным, этот прием помогает добиться глубины.

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

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

3. Заимствуйте цвета из интерьера

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

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

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

4. Сохраняйте цвета, которые вам нравятся

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

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

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

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

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

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

5. Доверьтесь цветовому справочнику Pantone

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

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

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

6. Ищите цвета в природе

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

Отличные подборки природных цветовых коллекций вы можете найти на Design Seeds.

7. Используйте не более 3-4 цветов

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

8. Сопоставьте цвет с настроением своего проекта

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

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

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

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

9. Используйте Pinterest для поиска тематических палитр

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

Вот как выглядят результаты запроса по «Летним цветовым палитрам» в Pinterest. «Фишка» здесь в том, что вы получаете вдохновение из самых разных сфер: интерьер, мода, графика и даже оформление праздников.

10. Посещайте тематические сайты

Colourlovers – это творческое сообщество, где люди со всего мира создают и выкладывают цвета, палитры и шаблоны. Зарегистрируйтесь, и вы получите доступ к более чем 3,7 миллионам цветовых палитр.

Теперь ваша очередь

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

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

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

Уважаемый/ая коллега!

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

Информация и регистрация здесь.

Поделиться в соц. сетях:

как подобрать гармоничные цветовые сочетания

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

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

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

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

Что такое палитра цветов и зачем она нужна дизайнеру интерьера

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

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

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

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

Полезные ссылки: Дизайн интерьера обучение, Обязанности дизайнера интерьера, Архитектор-дизайнер зарплата.

Основные правила в подборе цветов

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

• монохромная гармония;
• полярная гармония;
• гармония соседних цветов;
• триада.

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

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

Как дизайнеры интерьера используют цветовой круг Иттена

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

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

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

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

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

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

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

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

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

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

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

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

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

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

• Color Supply;
• Coolors;
• ColorBlender;
• Color Palette Generator;
• ColorKuler;
• Adobe Color CC.

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

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

Как освоить колористику на курсах дизайна интерьера

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

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

• «Профессия дизайнер жилых и коммерческих интерьеров» от SKILLBOX предлагает большой пакет дизайнерских курсов, в которых в обязательном порядке изучается роль цвета в создании атмосферы помещения. Учеников ждут часы занятий с опытными преподавателями, работающими в отрасли строительства и дизайна. По итогу ученики получают сертификаты международного образца и рекомендации для дальнейшего трудоустройства в солидные компании.
• «Факультет Дизайна жилых интерьеров» предлагает обширный курс. Здесь есть отдельный блок, посвященный колористике. В него входят темы, связанные с введением в науку о цвете, системами моделирования, понятием цвета в пространстве. Всего занятия длятся 4 недели. Во время их ученики узнают все нюансы колористики в теории и на практике.
• Курс «Профессия дизайнер интерьеров» помогает не только освоить новую сферу деятельности, но и найти достойное место работы. Курсы проходят онлайн. Их программа состоит из разных аспектов деятельности. И хотя отдельно колористика не выделяется, она рассматривается в большинстве тем, связанных с разработкой и визуализацией проектов. Успешное выполнение всех заданий курса гарантирует не только работу, но и создание личного узнаваемого стиля, в котором работа с цветом играет далеко не последнюю роль.

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

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

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

Что почитать про колористику: подборка книг

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

Вот самые лучшие из них.

Кассия Сен-Клер «Тайная жизнь цвета»

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

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

Дерек Джармен Хрома «Книга о цвете»

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

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

Жан-Габриэль Косс «Цвет. Четвёртое измерение»

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

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

Адамс Мориока, Терри Стоун «Дизайн цвета. Практикум»

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

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

Патрик Бейти «Анатомия цвета»

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

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

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

Часто задаваемые вопросы

Можно ли стать дизайнером без специальных знаний по колористике?

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

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

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

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

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

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

Поможет ли умение работать с цветом зарабатывать больше денег?

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

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

Коротко о главном

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

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

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

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

С уважением, Татьяна Федорченко
специально для проекта proudalenku.ru

Дизайн в цвете. Цвет — это мощная сила в руках дизайнера — UXPUB

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

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

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

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

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

Выбор цветовой палитры

Шаблон для палитры

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

Определите цель

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

Спросите себя следующее:

• Какой посыл вы хотите передать через дизайн?
• Какова цель вашего дизайна? Быть информативным? Убеждать?
• Какие эмоции вы хотите рождать своим дизайном у пользователей?

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

Определите свою аудиторию

Кто ваша аудитория, и как это влияет на дизайн?

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

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

Красный конверт в Китае

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

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

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

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

Хороший материал для старта – Теория цвета от Design School и Цветовая теория 101 от Hubspot. Прочитайте об интересном применении теории цвета в посте Почему Facebook синий? Наука за цветами в маркетинге.

Поиск вдохновения

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

Обычным источником вдохновения для цветовых палитр являются сайты вроде Dribbble и Behance. Если вы хотите вдохновиться для конкретного стиля дизайна, например, material design, можете использовать сайт вроде MaterialUI. Эквивалент в плоском дизайне – FlatUIColors.

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

Дизайн интерьеров оживляет пространство с помощью цвета.

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

Корейские клипы отлично вдохновляют

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

Вдохновение повсюду, включая вашу повседневную жизнь.

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

Задайте дизайн-систему

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

В качестве примера дизайн-системы посмотрите на систему Salesforce. Больше примеров найдете в 50 дотошных руководствах по стилю, которые должен увидеть каждый стартап перед запуском.

Дизайн-система MashCreative

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

При выборе палитры для дизайна лучше следовать принципу KISS (Keep it simple, stupid – Делай проще, дурачок!). Чем меньше цветов, тем лучше. Для большинства систем дизайна такая структура отлично подойдет для старта:

• Фон
• Главный тон
• Вспомогательный тон
• Цвет ошибки
• Цвет успешной операции

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

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

Состояния дизайна

Выбор цветовой палитры

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

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

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

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

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

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

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

Геометрическое представление может выглядеть примерно так.

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

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

Цвета бренда Airbnb

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

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

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

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

Начните без цветов, а затем медленно их добавляйте

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

Заключение

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

Я бы хотел знать, как вы работаете с цветами. Каков ваш процесс? Делитесь в комментариях.

Эффективная цветовая палитра веб-дизайнера | GeekBrains

Влияние цвета на дизайн.

https://gbcdn.mrgcdn.ru/uploads/post/1193/og_cover_image/2776fd036997a74527ade9d8b1a0e3a5

Как много вы знаете о цветоведении? Если немного — спешите пополнить знания, для качественного дизайна сайта они необходимы. Исследования, проведенные в области цветоведения доказали, что порядка 80% всего видимого спектра воспринимается нами на подсознательном уровне. Цвет влияет на настроение, вызывает ассоциации, способствует принятию решений.
Цвет на сайте:

• Привлекает внимание.
• Благоприятствует «усвоению» информации.
• Улучшает запоминаемость.
• Подчеркивает свойства товаров и услуг.
• Формирует позитивное/негативное отношение.

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

Красный

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

Оттенки красного

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

Оранжевый

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

Зеленый

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

Желтый

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

Синий

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

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

Фиолетовый, розовый

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

Черный

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

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

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

Трендовые цвета в веб-дизайне

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

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

Теплые цвета в веб-дизайне в 2021 году

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

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

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

Жидкое золото

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

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

Все оттенки розового

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

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

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

Красно-оранжевые тона

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

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

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

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

Цвета, как напоминание о единстве человека с природой

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

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

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

Холодные цвета в веб-дизайне

Серый как основа

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

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

Радикально черный 

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

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

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

Классический синий

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

Цвет морской волны и мята

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

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

Актуальное сочетание цветов в веб-дизайне в 2021 году

Футуристические сочетания цветов

Сочетание розового, синего и пурпурного, фиолетового сегодня в тренде у веб-дизайнеров. 

Шаблон сайта от Ucraft

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

Трио: голубой, серый и синий

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

Классика: черный, белый и серый

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

Шаблон сайта от Ucraft

Цветовые тренды для разных стран

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

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

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

Чтобы дизайнеру облегчить работу по подбору палитры для сайта, созданы специальные сайты и сервисы:

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

• Color Mixer — инструмент для работы над палитрами. Регулируя параметры оси, формируйте оптимальное цветовое сочетание. 

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

• Color Leap — сервис поиска из 180 цветовых схем, используемых человечеством на протяжении последних 4000 лет. На сайте легко проследить, как менялись популярные оттенки в каждом веке и столетии.

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

• CoolHue 2.0 — представляет в общее пользование 60 разнообразных градиентов, их можно экспортировать как изображение или скачать кодом.

• Pigment — сервис, который поможет генерировать яркие оттенки. Система отталкивается от определенного пигмента и освещения. 

• Palettable — на этом сервисе можно подобрать цвета по принципу хорошо/плохо. Редактирование происходит вручную, поэтому можно подобрать тон так, чтобы он гармонировал с другими тонами.

• Culrs — на этом ресурсе профессионалами собраны готовые цветовые схемы. Здесь можно найти подходящую палитру для дизайна своего сайта.

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

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

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

• Грамотно подобранный цвет сайта, на 80% делает бренд более узнаваемым.

• На 90% первое впечатление, которое появляется у юзера от сайта зависит от выбранной палитры.

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

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

• Выбор определенной цветовой палитры упрощает дизайнеру работу при расширении сайта.

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

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

В палитре веб-сайта дизайнер может использовать несколько тонов. Однако во всем должна быть мера: лучше всего выбрать 1 основной и 2-3 дополнительных цвета. 

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

5 отличных генераторов цветовой палитры, которые должен попробовать каждый дизайнер

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

1.Picular

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

2. Масштаб

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

3. Colorinspire.io

Этот удобный куратор цветовой палитры был создан дизайнером и Dribbbler Алесом Несетрилом. Алес описывает Colorinspire.io как «одностраничный макет, который включает в себя 48 лучших цветовых комбинаций, которые использовались с течением времени и организованы в сетку из трех столбцов. Вы можете пролистать их все и щелкнуть любой цвет, чтобы скопировать его шестнадцатеричный код в буфер обмена ».

4. Музли Цвета

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

5. Сплошные краски

Если вы любите экспериментировать с цветом, вам особенно понравятся когезионные цвета. Просто введите существующую цветовую схему, которую вы создали (или используйте их рандомизированные палитры), затем выберите цвет наложения, который будет использоваться для объединения исходных цветов. Результат? Новая, прекрасно связная палитра!

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

БОЛЬШЕ ЦВЕТОВЫХ РЕСУРСОВ

Найдите больше историй о процессах в нашем блоге Courtside. Есть предложение? Свяжитесь с [email protected].

6 удобных генераторов цветовой палитры для графических дизайнеров

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

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

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

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

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

1. Хрома

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

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

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

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

2. Color Hunt

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

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

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

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

3.ColorBox

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

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

Дизайнер Lyft Кевин Арнотт более подробно рассказывает об этом инструменте и о том, как он был создан в своей статье на Medium.Вот что он сказал о целях команды при создании ColorBox:

«В Lyft мы верим в инклюзивное будущее, когда каждый может выбрать продукт и добиться успеха. Мы чувствуем, что для того, чтобы наступило инклюзивное будущее, всем нам нужно думать о доступных продуктах и ​​создавать их. Итак, сегодня мы поделились своими знаниями о работе с цветом и открыли исходный код нашего цветового алгоритма. Чтобы гарантировать, что каждая команда, заинтересованная в использовании этого цветового алгоритма, сможет это сделать, мы объединили его в виде веб-инструмента, который мы называем ColorBox.

4. Кафе «Цвета»

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

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

5. Охладители

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

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

Создатель (и дрибблер) Фабрицио Бьянки сделал приложение Coolors доступным для iOS и Android, что позволяет очень легко просматривать цветовые палитры прямо с телефона. За 5 долларов вы также можете загрузить надстройку Coolors для Adobe Illustrator и Photoshop, чтобы получить доступ к сохраненным цветовым палитрам прямо из этих программ.

6. Цветовой код

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

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

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

Узнайте больше об обновлениях в нашем блоге Courtside. Есть предложение? Истории контактов @ dribbble.com.

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

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

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

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

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

1. Hidden Treasures

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

2. Neon Pop

Яркость Torch Red, Neon Carrot и Puerto Rico успокаивается и компенсируется персиково-розовым и темно-серым оттенками. Подобно блестящему рекламному щиту или плакату, висящему на твердой каменной стене, Scorpion поддерживает и поддерживает другие цвета, которые обычно появляются со страницы.

3. Paris Interlude

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

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

4. Золотая осенняя слава

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

5. Pacific Sunrise

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

6. Карибское приветствие

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

7. Зимний туман

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

8. Rich November

Chathams Blue — невероятно насыщенный цвет, часто встречающийся на сильно окрашенном белье. В сочетании с дополнительным оттенком Golden Grass эти роскошные оттенки согревают разум. Эта палитра станет захватывающим поворотом для соседнего магазина, антикварного магазина или бренда предметов роскоши. Используйте Del Rio в качестве фона и Балтийское море для текста, и ваш дизайн будет полностью готов.

9. Международный рейс

Путешествие по миру приносит приключения и тепло в душу, как и эта цветовая палитра.Пока Armadillo и Zeus закрепляют ваш бренд в мире, Hit Pink и International Orange помогают вам взлететь. International Flight — идеальная палитра для взрослого бренда, элегантная и утонченная, но в то же время острая.

10. Строительный шторм

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

11. Mexican Waters

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

12. Субботний бранч

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

13. Old West

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

14. Полярная звезда

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

15. Весенние цветы

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

16. Витраж

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

17. Повседневная элегантность

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

18. Уютный французский

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

19. Классика середины века

Эти всегда стильные, вдохновленные серединой века цвета вне времени вне зависимости от текущих цветовых тенденций.

20. Сонная Седона

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

21. Old Arizona

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

22.Industrial Grays

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

23. Gathering Storm

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

Следующие шаги

Готовы вывести визуальные эффекты вашего бренда на новый уровень?

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

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

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

50 лучших цветовых схем для веб-сайтов 2021 года

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

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

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

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

1. Зои Пеппер

# 361999 # 78fff1 # ff6495

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

2. Юкон 1000

# 162b32 # ff4838

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

3. Persoo

# 490b3d # bd1e51 # f1b814

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

4. Студия Simpatico

# 1a2238 # 9daaf2 # ff6a3d # f4db7d

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

5. Neverheart

# 371bb1 # 05f4b7 # 12151f

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

6.Карнавальные звуки

# 1fc58e # fae62d # 191414

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

7. Я взвешиваю Сообщество

# 9cf6fb # e1fcfd # 394f8a # 4a5fc1 # e5b9a8 # ead6cd

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

8. Советский дизайн

# 1a2c42 # be2f29 # ecaf44 # 0c1115

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

9. Уродливые напитки

# 00abe1 # 161f6d

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

10. Основание Taproot

# 00a9d8 # 0d9edf # 259b9a

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

11. Омега дрожжи

# f7f7f7 # 7da2a9

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

12. Farm Food

# ffffff # a7bc5b # 8da242

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

13. Jebsen Careers

# 3fd2c7 # 99ddff # 00458b

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

14. IC Creative

# fb8122 # 1d2228 # e1e2e2

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

15.Мангров Отель

# d48166 # 373a36 ## e6e2dd

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

16. Сон

# 051622 # 1ba098 # deb992

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

17. Атланта пивоварня

# e40c2b # 1d1d2c # f7f4e9 # 3cbcc3 # eba63f # 438945

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

18. Кафе на Солнечной улице

# 5c6e58 # 8aa899 # f2d349

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

19. Различие

# 000000 # 181818 # 2cccc3 # facd3d # 5626c4 # e60576

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

20. Pittori di Cinema

# fdd935 # 000000

Minimalism также может быть полноцветным, о чем свидетельствует Pittori di Cinema. Ярко-желтая цветовая гамма с черным — распространенный вариант высококлассного минимализма. Чем ярче цветовая палитра этого стиля, тем он кажется более модным.

21. Мы (Сердце) UX

# e1f2f7 # ef0d50 # eb3a70 # e5bace

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

22. Гордый и раздираемый

# 1f3044 # fb9039 # 646c79

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

23. Баобла

# 56642a # 849531 # 92a332

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

24. Центр неотложной помощи для женщин и девочек

# faf0dc # 0b4141 # ff6864

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

25. Портфолио Жана-Батиста Калойя

# 150734 # 0f2557 # 28559a # 3778c2 # 4b9fe1 # 63bce5 # 7ed5ea

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

26. Игорь

# 000000 # fefefe # fdee30

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

27. Ковбойский байк

# 000000 # fa255e # c39ea0 # f8e5e5

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

28. Габриэль Долан

# e8eae3 # 373833 # fa2742

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

29. Пиксельная кладовая

# 9e15bf # 4ac6d2

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

30. Одиннадцать растений

# 5daa68 # 3f6844 # faf1cf

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

31. Qvartz

# ee7879 # 2a3166 # f4abaa # cae7df

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

32. Sheerlink от RTX

# 4a2c40 # e9bd43 # 7d3780

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

33. Пуэрто Мате

# 5ce0d8 # 01345b # ffcf43

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

34. Портфолио Loic Sciampagna

# 141824 # ffb600 # 0049ff

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

35. Канатал

# 182978 # 6688cc # acbfe6

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

36. FFWD Digital

# f1e821 # 487afa # 23c0ad

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

37. Tappezzeria Novecento

# 191919 # fab162

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

38. Тэв

# 252669 # 4ecb4a

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

39. Ниша и культ

# 4e3883 # ffddcc

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

40. Sysdoc

# 001730 # 4ad7d1 # fe4a49

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

41. Обжарщики кофе Veneziano

# f6f4f2 # 425664 # c6ad8f

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

42. Лучшая энергия

# 11abc1 # df3062 # f5b935 # 4bac3f

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

43. Взрывная галактика

# 0f0c24 # a350a3 # c1436d

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

44. Портфолио Кайла Декера

# f5f5f5 # 8db48e # 4d724d

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

45. Подмигнуть

# 212221 # 1181b2 # ddedf4 # 44449b

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

46. Пивоварня Archibald Microbrewery

# d81c23 # 4fa8c2 # d97441 # d29849

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

47. Индеги

# 45af2a # 3fddc1 # d56c06

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

48. Рюкзак

# ad4328 # b65741

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

49. Демисол

# 16519f # f07e74 # f8dd2e # 4fcbe9

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

50. Dropbox

# 61082b # b4d0e7

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

цветовых схем | Коллекции современных цветовых палитр 2020 и 2021

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

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

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

Почему мы предоставили этот список? Мы обслуживаем подрядчиков и компании, предоставляющие услуги на дому, с помощью маркетинга + веб-дизайна! Ознакомьтесь с сообщениями в нашем блоге о лидерах по сантехнике, электрикам, кровельщикам, специалистам по HVAC, строителям, специалистам по ремоделированию и нашим SEO по сантехнике, SEO по электрикам, SEO по кровлям, SEO по подрядчикам, SEO по ремоделированию и услугам по HVAC SEO!

Цветовые схемы на 2021 год!

Вот цветовые схемы последних лет «Цветовые схемы 2020» — опубликовано в декабре 2020 года!

Лучшие инструменты для создания цветовых схем на 2021 год:

Критерии:

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

1. Coolers.co — предлагает несколько приличных цветовых схем — просто нажмите генерировать несколько раз, чтобы запустить двигатель!

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

3. Colormind.io — Говорят, что Colormind использует «глубокое обучение» для усвоения цветовых схем из популярных фильмов и произведений искусства, что помогает придумывать лучшие цветовые схемы.По крайней мере, это забавный поворот в цветовых схемах на 2021 год!

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

Из оригинальной публикации: Цветовые схемы 2019:

12 современных инструментов цветовой палитры для использования в 2019-2021 годах

1. Coolors.io

Подходит для: графических дизайнеров / веб-дизайнеров

Coolors.co — это первый и наиболее полный инструмент, доступный для создания цветовой палитры и схемы в этом списке. Платформа невероятно надежна и включает в себя веб-приложение для генерации, а также приложение для iOS, загрузку изображений в цвета, дополнительные настройки и параметры экспорта / обмена. Он даже поставляется с плагином для программ Adobe CC (Photoshop и Illustrator), хотя эта функция стоит 5 долларов (что я лично считаю довольно доступным). Но больше всего мне нравится то, что вы можете создать бесплатную учетную запись, чтобы управлять создаваемыми цветовыми палитрами и организовывать их.Эта учетная запись также будет синхронизироваться с приложениями iOS + Adobe. Это особенно полезно, если вы графический или веб-дизайнер и хотите отслеживать цвета, которые вы создаете для различных клиентов. Это также пригодится, если вам нужен быстрый доступ во время проектирования. Еще одним бонусом является то, что Coolors предлагает два месяца бесплатных занятий на Skillshare.com. Я бы сказал, что это отличная кража!

2. Canva.com

Подходит для: Графических дизайнеров-любителей

Canva.com предлагает инструмент, который позволяет пользователям загружать изображения, из которых будет создана цветовая палитра.Замечательно то, что этот инструмент предлагается совершенно БЕСПЛАТНО БЕЗ РЕГИСТРАЦИИ. Это чрезвычайно полезно при разработке материалов для бренда, который широко представлен на фотографиях и где цвета не имеют значения для брендинга. Или, возможно, есть конкретная фотография, к которой клиент обращается и хочет, чтобы на его основе была создана палитра для его бренда.

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

3. Colormind.io

Подходит для: графических дизайнеров / веб-дизайнеров

Когда я нашел Colormind.io, я подумал, что это простое приложение для создания цветовых схем, но, покопавшись немного глубже, я понял это намного больше и намного круче, чем это.Colormind — это веб-приложение, которое позволяет вам создавать цветовые схемы для вашего сайта. Но что делает его уникальным, так это то, что он на самом деле визуализирует, как это будет выглядеть для вас на веб-сайте. Он также имеет встроенную поддержку Material Design и поддержку загрузки изображений. Как это круто? Просто, но действительно извлекает выгоду из того, что делает. Убедитесь в этом сами на Colormind.io.

4. Mycolor.space

Подходит для: веб-дизайнеров / дизайнеров пользовательского интерфейса

Это инструмент, который я лично использую довольно часто.Что мне действительно нравится в MyColor.Space, так это его простота и чистый пользовательский интерфейс. Инструмент создания цветовой палитры позволяет вам выбрать один цвет, из которого веб-приложение будет выдавать различные градиенты и шестнадцатеричные коды на основе этого цвета. Кроме того, в веб-приложении есть отличные инструменты для создания градиента. Что мне действительно нравится в инструменте создания градиента, так это то, что он выделяет CSS, необходимый для создания градиентов. Так что вы можете просто скопировать и вставить их прямо в свой интерфейсный код!

5.Design Seeds

Подходит для: Визуальных дизайнеров / графических дизайнеров / веб-дизайнеров

Какой была бы публикация в блоге об инструментах цветовой палитры без включения Design Seeds? Это не веб-приложение для создания палитры, а блог, посвященный вдохновению на создание палитры. Что они сделают, так это сделают снимок, а затем разместят палитру на основе этой фотографии с модными названиями, такими как «Moody Opulence» и «Drift». Лично я не часто пользуюсь этим сайтом, но отправляю его клиентам, когда пытаюсь понять их бренд.Будет полезно, если у вас нет отправной точки или вы действительно знаете, что ищете, когда дело касается вдохновения для дизайна. Я также думаю, что это то, что могло бы распространиться на пространство дизайна интерьера.

6. Pantone Studio

Подходит для: графических дизайнеров / полиграфистов

Этот список не будет полным без упоминания Pantone, тем более что они по сути являются ведущими экспертами в области цвета. Оказывается, у них есть довольно крутое приложение для объединения палитр.С помощью приложения вы можете обнаружить множество цветовых гармоний, значений и перекрестных ссылок, распределяя их в RGB, CMYK и HEX. Единственным недостатком является то, что приложение предназначено только для iOS, поэтому пользователи Android проигрывают. Я также не уверен, что когда-либо использую подобные приложения для мобильных телефонов в процессе разработки, но они могут работать лучше для кого-то другого. Попробуйте, чтобы увидеть, работает ли он для вас!

7. Adobe Kuler (Color Wheel)

Подходит для: графических дизайнеров / веб-дизайнеров / дизайнеров пользовательского интерфейса

Я давно знаю об Adobe Kuler, потому что раньше он существовал как приложение для iOS.Допускаю, что я еще не подтвердил это. Однако, если вы зайдете на сайт, теперь он будет ссылаться на довольно простой инструмент для создания цветовой палитры. Здесь нет никаких излишеств, но вы можете создавать палитры, импортируя изображение или используя цветовое колесо. Затем вы можете сохранить эти темы. Если у вас есть учетная запись Adobe CC, вы можете сохранить ее в своем профиле и синхронизировать со своими приложениями CC. Довольно изящно, если вы спросите меня! Единственная проблема здесь в том, что если вы не очень вдохновлены (я рекомендую проверить Design Seeds ранее в этом посте), тогда может быть сложно начать.

8. Палитра сайта

Подходит для: Веб-дизайнеров / UI-дизайнеров / Front-End разработчиков

Даровая больше любви к Web / UI / Front-End в этом списке, я представляю вам Палитру сайта. Палитра сайта — это расширение для Chrome, Safari и Firefox, которое позволяет создавать сложные цветовые палитры. Он также имеет возможность захватывать / извлекать цветовые схемы с уже существующих веб-сайтов. Так что если вам нравится то, что делает другой парень, тогда это ваше дело.Это удобный инструмент с отличным пользовательским интерфейсом, с помощью которого вы можете поделиться в таких приложениях, как Sketch и Adobe. Если вы хотите погрузиться еще глубже, он даже поставляется с API для семантического извлечения цвета. Это немного выше моей зарплаты, чтобы понять, но ничто другое в этом списке этого не делает. Хотя есть бесплатная версия, она также поставляется с версией PRO, в которой цены основаны на запросах API, если вам это нужно.

9. Bootstrap Magic

Подходит для: Веб-дизайнеров / UI-дизайнеров / Front-End разработчиков

Приветствуем всех веб-дизайнеров, дизайнеров пользовательского интерфейса и Front-End, использующих Bootstrap! Самый популярный адаптивный фреймворк на планете! Одна из вещей, которые мне лично не нравятся в Bootstrap, — это то, что стандартная раскраска довольно универсальна.Настройка, которая является огромной P.T.A. если вы знаете, что я говорю, и знаете, как это сделать. Войдите в Bootstrap Magic, где настройка цветовых схем для Bootstrap становится простой задачей. По-прежнему утомительно разбираться и выбирать цвета для всего, но, по крайней мере, у вас есть модный пользовательский интерфейс, чтобы делать это, вместо того, чтобы копаться в миниатюрных строках переменных и миксинов SASS. Bootstrap даже поставляется с редактором HTML, так что вы можете сделать это прямо из пользовательского интерфейса, если вам нужно (я часто настраиваю такие вещи, как кнопки и высоту строк).Это бесплатное веб-приложение, так что сходите с ума!

10. Bootstrap.build

Подходит для: Веб-дизайнеров / UI-дизайнеров / Front-End разработчиков

Bootstrap.build очень похож на Bootstrap Magic выше, хотя кажется немного более надежным. Это веб-приложение больше предназначено для разработчиков с большим количеством настроек переменных SASS. Он также имеет специальные параметры экспорта / импорта, а также режим предварительного просмотра. Пользовательский интерфейс, на мой взгляд, тоже немного приятнее.Этот вариант поставляется с профессиональными опциями за 5 долларов в месяц, что позволяет вам организовывать темы Bootstrap в различные проекты. Вы также можете разместить темы через CDN. Это довольно ценные функции, если вы много занимаетесь проектированием и разработкой для клиентов. Проверьте, работает ли он для вас!

11. Инструмент цвета материала

Подходит для: UI-дизайнеров / разработчиков приложений

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

12. Цветовая палитра материалов

Подходит для: UI-дизайнеров / разработчиков приложений / веб-дизайнеров

Другой инструмент, основанный на материалах, — это палитра дизайна материалов. Этот инструмент значительно проще, чем инструмент Google Material. Инструмент «Палитра» позволяет вам выбрать два цвета, которые затем автоматически сформируют вкус на основе стандартов Google для материалов. Хотя цель этого инструмента ориентирована на приложения, он может быть полезен, если вы просто искали средство для создания цветовой гаммы.Приложение выводит шестнадцатеричные коды и все такое, поэтому их цвета действительно могут быть использованы для любого приложения. Существует также изящное справочное руководство по значкам материалов, а также справочное руководство по цветам материалов, в котором вы можете копировать и вставлять шестнадцатеричные коды. Проверьте это!

62% опрошенных компаний заявили, что, по их мнению, веб-сайт следует обновлять каждые 2–3 года. Источник: Hook Agency

Надеюсь, вам понравились эти потрясающие современные цветовые палитры / цветовые схемы для веб-сайтов и инструменты для создания цветовых схем!

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

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

Социальные сети для подрядчиков Курс + ежедневные подсказки

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

🎥 10 оригинальных видео

📝 6 недель ежедневных подсказок в социальных сетях

Есть ли вы или кто-то из вашей команды, кто хотел бы это сделать? Введите их информацию (или свою) ниже!

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

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

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

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

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

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

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

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

Adobe Color CC

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

Paletton

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

Coolors

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

Canva

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

0to225

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

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

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

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

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

Хелен и Джош

The Pittmans

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

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

drawmote

JetStyle

Bloody

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

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

HuffPost

Дикая тайга

Sooma

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

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

QAccount

notis

Zapare Technologies

Better Therapeutics

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

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

El Burro

Jude’s Ice Cream

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

Заключение

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

Выбор цветовой палитры

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

Итак, почему так важно иметь определенную цветовую палитру?

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

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

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

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

Примите во внимание модный сезон и местоположение

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

Использование онлайн-платформ цветовой палитры

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

Используйте аналогичные цвета в своей цветовой палитре

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

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

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

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

Убедитесь, что цветовая палитра соответствует посланию и настроению вашего дизайна

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