Цветовые палитры сочетания цветов: IN COLOR BALANCE | Подбор цвета

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

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

Итак, как вы выберете два или три цвета? Цветовой круг может помочь.

Круг с 12 цветами является важным инструментом для создания цветовых схем

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

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

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

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

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

Calm использует аналоговые цвета, чтобы создать общее настроение.

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

Использование дополнительных цветов – простейший способ выделить что-то.

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

Добавление одного цвета в дизайн в оттенках серого просто и эффективно привлекает внимание. Макет с сочетанием белого и серого с синими акцентами в цветовой схеме Dropbox.

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

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

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

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

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

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

Добавьте цвет в самом конце, и даже тогда, только с определенной целью.

Добавление одного цвета в макет с оттенками серого привлекает взгляд просто и эффективно.

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

Цвет этой собаки темно-серый, а не черный.

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

Самый темный цвет у ASOS – не черный

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

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

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

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

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

• Зеленый (природный, безопасный, свежий): зеленый цвет отражает чувство окружающей среды и близость к природе. Он также означает рост, и именно поэтому он часто связан с бизнесом. Зеленый означает чувство правильного или неправильного.
• Синий (успокаивающий, ответственный, внушающий доверие, надежный): синий цвет часто ассоциируется со спокойными и расслабляющими эмоциями. Он также ассоциируется с силой и надежностью, с чувством доверия и профессионализма. Синий излучает чувство внутренней безопасности. Вот почему вы можете видеть банки и технологические компании, использующие этот цвет. Гиганты социальных сетей, такие как Facebook, Twitter и LinkedIn, используют синий цвет в своих сетях.
• Фиолетовый (Роскошный, Таинственный, Романтичный, Духовность): Исторически связанный с королевской семьей, фиолетовый намекает, что продукт высокого класса.

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

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

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

Примерно 8% мужчин и 0,5% женщин страдают от некоторой формы цветовой слепоты. Это 1 из 12 мужчин и 1 из 200 женщин. Хотя существует несколько форм этого заболевания, красно-зеленая цветовая слепота является наиболее распространенной. Человек, страдающий этой формой дальтонизма, обычно испытывает проблемы с различиями как красного, так и зеленого цветов.

Как видит цвета человек с нормальным зрением и те же цвета человек с красно-зеленой цветовой слепотой (дейтеронопия и протанопия).

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

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

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

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

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

• Маленький текст должен иметь коэффициент контрастности не менее 4,5: 1 по отношению к фону.
• Большой текст (при 14 pt жирный / 18 pt обычный) должен иметь коэффициент контрастности по крайней мере 3: 1 по отношению к фону.

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

Программа проверки цветового контраста от Webaim

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

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

Adobe Color CC – отличный инструмент, способный ускорить изучение различных вариантов цветовой схемы.

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

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

Укажите минимальный процент содержимого цвета

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

ColorZilla – это расширение для Google Chrome и Mozilla Firefox, которое включает в себя множество связанных с цветом инструментов, в том числе подборщик цветов, пипетку, генератор градиента CSS и браузер палитры.

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

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

Coolors дает вам возможность загрузить изображение и сделать из него цветовую палитру.

С помощью Photoshop вы можете проверить доступность вашего дизайна. Просто перейдите в View> Proof Setup, а затем вы можете выбрать один из двух типов цветовой слепоты (протанопия или дейтронопия).

Во избежание проблем с доступностью в дизайне, при проектировании рекомендуется проверять дизайн на цветовую слепоту. NoCoffee Vision Simulator может использоваться для имитации проблем со зрением. Например, используя параметр “Color Deficiency” установив “Deuteranopia”, вы можете просматривать веб-страницы в оттенках серого. Это поможет вам сделать ваш дизайн доступным для пользователей с нарушениями зрения.

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

Цветовые схемы – ваша проблема? Записывайтесь на курсы от Springboard Введение в UX дизайн. Тысячи студентов прошли их, чтобы начать успешную карьеру в дизайне.

Перевод статьи Nick Babich

восемь правил подбора цветовой палитры, которые должны знать все / Хабр

Взаимодействие человека с компьютером во многом опирается на графические элементы интерфейса, и цвет играет в этом процессе не последнюю роль. Как однажды сказал Pierre Bonnard: «Цвет не просто делает дизайн приятным для глаз, но и подкрепляет его».

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

1. Ограничьте количество цветов

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

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

Как выстроить палитру

Но как выбрать эти два-три цвета? Тут вам поможет цветовой круг.

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

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

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

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

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

— Палитры из родственных цветов

Родственные цвета — это те, которые располагаются рядом друг с другом на круге.

Такие гаммы строятся на базе родственных цветов: один из них становится опорным, а остальные используются, чтобы обогатить палитру. Здесь все тоже достаточно просто, но фокус заключается в том, чтобы правильно выбрать яркость используемых цветов — она будет задавать тон для всей гаммы. Например, Clear, утилита для организации списка дел с жестовым управлением, использует кричащие цвета, чтобы визуально привлечь внимание к тем задачам, которые пользователь выполняет в данный момент. Напротив, в приложении для медитации Calm предпочтение отдается паре родственных цветов «синий+зеленый», чтобы создать у пользователей ощущение покоя и умиротворения.

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

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

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

— Кастомизированные палитры

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

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

2. Черпайте вдохновение в природе

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

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

3. Старайтесь придерживаться пропорции 6/3/1

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

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

4. Сначала проектируйте в черно-белой гамме

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

Вводите цвет в последнюю очередь и очень целенаправленно.

Яркое пятно на сером фоне — простой и эффективный способ направить взгляд на нужный объект.

5. Избегайте черного цвета

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

Если добавить в ваш комплект тщательно отобранных цветов черный, он «задавит» собой все остальные. Он так сильно бросается в глаза именно потому, что не воспринимается как естественный. Многие приложения, которыми мы пользуемся изо дня в день, добавляют в интерфейс якобы черные цвета, которые на самом деле темно-серые. Например, самый темный цвет в верхней панели приложения Asos — не #000000, а #242424. Так что не забывайте регулировать насыщенность.

6. Выстраивайте визуальную иерархию при помощи контраста

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

Благодаря контрасту одна область экрана заметно отличается от остальных.

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

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

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

Красный, Оранжевый, Желтый

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

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

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

Зеленый, Синий, Фиолетовый

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

Синий (спокойный, ответственный, заслуживающий доверия, надежный): Синий цвет обычно ассоциируется с чувствами покоя и умиротворения, а также с силой и надежностью, что в общем дает ощущение профессионализма и возбуждает доверие. Синий внушает нам, что мы в безопасности. По этой причине его активно используют банки и IT-компании. У многих титанов на рынке социальных сетей (Facebook, Twitter, LinkedIn) в интерфейсе также фигурирует синий.

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

Розовый, Черный, Белый, Серый

Розовый (женственность, невинность, юность): Наиболее широко известная ассоциация с розовым цветом — это женственность.

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

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

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

Здесь важно отметить, что значения цветов могут сильно меняться в зависимости от обстоятельств и культурного контекста. Чтобы глубже ознакомиться с этой темой, прочитайте статью Symbolism Of Colors And Color Meanings Around The World.

8. Сделайте дизайн доступным

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

Не используйте цвет в качестве единственного индикатора

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

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

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

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

Делайте текст как можно контрастнее

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

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

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

• Если текст мелкий, соотношение должно быть не меньше 4.5:1;
• Для крупного текста (то есть 14 pt и выше для жирного шрифта, 18 pt и выше — для обычного) оптимально соотношение 3:1 и больше.

Но есть хорошая новость: вам не придется проверять все вручную. При помощи Color Contrast Checker рассчитать коэффициент можно в несколько кликов.

Бонус: Инструменты, необходимые для UX дизайнера

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

Adobe Color CC
Adobe Color CC (раннее известный как Kuler) — отличное решение, чтобы находить, редактировать и создавать палитры. Вы можете модифицировать каждый цвет, входящий в состав гаммы, или устанавливать его в качестве опорного буквально в пару кликов. Готовые палитры можно сохранять и добавлять в библиотеку; кроме того, в открытом доступе на сайте находится большое количество цветовых гамм, созданных другими членами сообщества.

Dribbble Search-by-color
Если хотите посмотреть, как другие дизайнеры применяют тот или иной цвет в своих проектах, перейдите по адресу dribbble.com/colors и выберите нужный оттенок.

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

Colorzilla
Colorzilla — расширение для браузеров Google Chrome и Mozilla Firefox, которое включает целую кучу инструментов для работы с цветом, включая пипетку с возможностью захвата цвета, генератор градиентов CSS и функцию просмотра палитр.

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

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

Симулятор дальтонизма в Adobe Photoshop
Photoshop позволяет проверить, насколько ваш дизайн универсально доступен. Достаточно перейти на вкладку View > Proof Setup и выбрать интересующий ваш тип (Protanopia type или Deuteranopia type).

NoCoffee Vision Simulator for Chrome
Чтобы удостовериться, что ваш дизайн доступен для всех, неплохо бы на себе испытать дальтонизм в процессе проектирования. NoCoffee Vision Simulator обеспечивает возможность создать для любого интерфейса симуляцию, показывающую, как она выглядит для людей с цветовой слепотой или слабым зрением. Например, применив фильтр «Deuteranopia» во вкладке «Color Deficiency», вы увидите веб-сайт в тонах серого. Это поможет вам адаптировать интерфейс под потребности людей, у которых проблемы с глазами.

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

Генератор цветовой палитры Data Viz (для диаграмм и информационных панелей)

• Палитра
• Один оттенок
• Дивергент

Количество цветов

3 4 5 6 7 8

Цвет фона

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

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

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

Например, Google Analytics делает ужасную работу с этим:

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

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

Вот несколько советов, как получить наилучшую палитру:

• Попробуйте выбрать очень разных конечных цветов – напр. один теплый, один прохладный; один светлый, один темнее — чтобы ваша палитра покрывала более широкий диапазон
• Если вы используете фирменный цвет для одной конечной точки, не бойтесь немного изменить насыщенность и яркость , если это создаст более приятную палитру. Пользователи узнают ваш фирменный цвет по его оттенку гораздо больше , чем по его точной насыщенности/яркости.
• Для визуализации данных, где вы показываете сила одного значения , попробуйте вместо этого использовать Генератор палитры одного оттенка.

О, и…

Подробнее о цвете

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

• Цветовая система HSB: учебник для практикующих
• Цвет в дизайне пользовательского интерфейса: практическая основа
• Design Hacks, мой электронный бюллетень, в котором я отправляю оригинальные советы и тактики дизайна более чем 50 000 моих ближайших друзей.

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

Количество цветов

3 4 5 6 7 8 9

Изменить цветовую шкалу

Яркость

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

Цвет фона

Свет Темный

Действия

Копировать HEX-значенияЭкспортировать как SVG

В контексте

Как использовать

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

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

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

Вот несколько советов для получения наилучшей шкалы одного оттенка:

• Для перехода к конечной точке плоского серого установите «Интенсивность цвета» на ноль
• Для перехода к конечной точке белого цвета установите для параметра «Яркость» максимальное значение , а для параметра «Интенсивность цвета» — значение ноль.
• Если ваша цветовая шкала действительно показывает переменную, которая переходит от одного конца к нейтральной средней точке 9от 0028 до еще один конец , попробуйте генератор расходящихся шкал (например, от республиканца до умеренного до демократа; от более горячего до той же температуры до более холодного)

Количество цветов

5 7 9 11 13

Изменить цвет средней точки

Яркость

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

Цвет фона

Свет Темный

Действия

Копировать HEX-значенияЭкспортировать как SVG

В контексте

Как использовать

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

Возможно, наиболее распространенным примером этого является диаграмма «насколько демократическим/республиканским является каждый штат в США».

Беззастенчиво заимствован (?) из Five Thirty-Eight

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

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

30+ лучших новых цветовых комбинаций

Читать McKendree

1 из 35

Синий + коричневый

Шоколадно-коричневый и синий — это всегда выигрыш, но это фойе, спроектированное Элизабет Робертс, делает его еще лучше, чем обычно.

Tria Giovan

2 из 35

Календула + Крем

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

Roland Bello

3 из 35

Зеленый лайм + темно-синий

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

Николь Франзен

4 из 35

Персиковый + кремовый + хром

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

George Ross

5 из 35

Ruby + Ink

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

Stephen Kent Johnson

6 из 35

Бирюзовый + белый + теплое дерево

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

Mali Azima

7 из 35

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

Ngoc Minh Ngo

8 из 35

Amethyst + Scarlet

Бархатная банкетка служит плюшевым сиденьем за обеденным столом, задрапирована фиолетовой мешковиной от Elegant Fabrics. Трехлетняя дочь дизайнера Дэвида Кайхои сидит в красном стульчике для кормления Tripp Trapp от Stokke в квартире в Нью-Йорке.

Shade Degges

9 из 35

Bubblegum Pink + Greige

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

Thomas Loof

10 из 35

Желтый + бирюзовый

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

Jonny Valiant

11 из 35

Green Tea + Dusty Brown

Чтобы привнести ощущение природы в нью-йоркскую гостиную, дизайнер Фаун Галли использовала нестандартный мятно-зеленый: «Я не думаю, что цвет должен быть слишком насыщенный или сильный на стене». Стулья Pal + Smith с обивкой Safari от Мануэля Кановаса, диван Paley от Profiles, ковер Fiona Curran Palette для Rug Company и картина Энн Симс придают комнате «ощущение сказочной фантазии».

Heidi Caillier Design

12 из 35

Армейский зеленый + ярко-оранжевый

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

William Abranowicz

13 из 35

Tangerine + Dark Stone

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

Noe DeWitt

14 из 35

Sage + Aqua + Rattan

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

AMY NEUNSINGER

15 из 35

Big Apple Red + Dusty Blue

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

Kendall McCaugherty

16 из 35

Персиковый + черный + розовый

Черный и кремовый цвета успокаивают различные оттенки розового в этой великолепной комнате, спроектированной Брюсом Фоксом. Свет заливает золотым сиянием всю комнату.

Paul Raeside

17 из 35

Серо-синий + черный

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

Roland Bello

18 из 35

Малиновый + небесно-голубой

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

Emily Minton Redfield

19 из 35

Cherry + Brass

Стены вишнево-красного цвета с глянцевой отделкой и акцентами из латуни придают максимальную роскошь этой чайной комнате, созданной Мари Фланиган для House Beautiful 9Весь дом 0028 в Денвере. Это идеально подходит для столь необходимого тихого момента для одного.

Karyn Millet

20 из 35

Orange Cream + темно-бирюзовый

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

Werner Straube

21 из 35

Сапфир + горчица

Яркая «гибкая комната» в доме в Мичигане, спроектированная Кори Дейменом Дженкинсом, — это веселое место для детей, чтобы делать уроки, и для взрослых, где можно весело провести время. послеобеденные напитки. Лакированные стены — это на самом деле обои от Филипа Джеффриса.

Reid Rolls

22 из 35

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

Ник Олсен использовал привлекательные оттенки розового и голубого, чтобы покрыть каждый сантиметр девичьей спальни — взгляните на обои Christopher Farr Cloth на потолке!

David A. Land

23 из 35

Tangerine + Olive

Оливковая отделка на стенах с ярко-оранжевым рисунком? Это не звучит как , как должно работать, но эта столовая, спроектированная Шено Джеймсом для House Beautiful Весь дом в Нэшвилле — доказательство того, что это определенно так.

TRIA GIOVAN

24 из 35

Фисташка + барвинок

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

Jane Beiles

25 из 35

Royal Blue + Orchid

«Ничто не совпадает, но все работает вместе», — говорит дизайнер Шарлотта Барнс о ярко-синей кухне в семейном загородном доме в Южной Каролине. Ее любимый оттенок? Хейг Блю Фэрроу и Болла.

Thomas Loof

26 из 35

Blush + Mahogany

Мэтью Картер использовал бледно-розовые стены, окрашенные краской Benjamin Moore’s Precocious, в качестве фона для антикварной деревянной мебели в загородном доме на Багамах.

Дэвид А. Лэнд

27 из 35

Ирис + Кримсон

Чувствуете себя смелым? С фиолетовым потолком (Delicate Petal от Pratt & Lambert) и красными стенами (Red Statement, также от Pratt & Lambert) гостиная в доме Кэти Браун в Коннектикуте поражает воображение.

CHRISTOPHER DELANEY

28 из 35

Фуксия + Яично-голубой Робин

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

Douglas Friedman

29 из 35

Желтый + белый

Яркие желто-белые обои Clarence House в этом уголке для завтрака, разработанном Кристой Юарт, обеспечат яркое начало дня. «Желтый цвет такой свежий и солнечный, а комната выглядит немного ретро с белыми китайскими стульями Чиппендейл и полом, выкрашенным в черный цвет», — говорит она.

Люк Уайт

30 из 35

Бирюзовый + Кирпич

«Насыщенные цвета уравновешивают силу архитектуры», — говорит Джени Молстер об этом исследовании 1700-х годов в Вирджинии, где красные шторы свисают со стен в цвете Mill Spring Blue Бенджамина Мура.

7 удивительных цветовых схем веб-сайтов 2022 + Color Mood Board

Веб-дизайн

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

Расчетное время чтения:   25 минут

Поделиться: 

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

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

Ниже мы расскажем, почему цветовые схемы важны, и предоставим вам 65 цветовых схем веб-сайтов на 2021–2022 годы!

Ниже приведены еще более удивительные инструменты, но вот самые крутые инструменты цветовой палитры Design, которые я видел в 2022 году — Happy Hues!

Сумасшедшая часть заключается в том, что цветовая схема имеет гораздо большее значение, чем вы думаете, а целостная и привлекающая внимание цветовая схема является одним из главных аспектов веб-дизайна, который сделает ваш веб-сайт БОЛЕЕ ПРИВЛЕКАТЕЛЬНЫМ И КРАСИВЫМ ДИЗАЙНЕМ (Шаг первый – Шаг второй). = Получите больше трафика Поисковая оптимизация.)

38 процентов посетителей перестанут взаимодействовать с веб-сайтом, если его содержание или макет непривлекательны. (Blue Corona)
Учитывая 15 минут на просмотр контента, две трети людей предпочли бы прочитать что-то красиво оформленное, чем что-то простое. (Источник: Adobe, Social Media Color)

Содержание

7 новых цветовых схем на 2022 год

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

1. Синий электрик — Цветовая схема веб-сайта Cleo

Источник: WWD.com

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

Electric Blue: #373e98

Hot Pink: #f16775

Shocking Yellow: #fee36e

Chartreuse-ish: #ceb92c

Darkest Gray: #2a2a2a

2 Ярко-оранжевый — Цветовая схема веб-сайта Bonjour Paris

Источник: Stylecaster.

com

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

Black: #000000

Medium Gray: #565656

Light Gray: #9e9e9e

Hot Orange: #fba92c

White: #FFFFFF

3. Muted Green – Цветовая схема веб-сайта The Cool Hunter

Источник: Sherwin-Williams.com

Better Homes and Gardens составила список всех «Цветов года 2022», объявленных на данный момент малярными компаниями. Безусловно, некоторые вариации этого приглушенного зеленого цвета кажутся наиболее популярными. Этот веб-сайт электронной коммерции включает этот популярный оттенок очень простым способом, используя фоновое изображение, показывая, что дизайн вашего веб-сайта не обязательно должен быть слишком сложным, чтобы выглядеть сплоченным и профессиональным, особенно при использовании правильных цветов.

Beige: #c8b7a6

Perriwinkle: #7d94b5

Dusty Rose: #c29591

Maroon Brown: #703f37

Muted Green: #b6c199

4. Lemon Lime – Цветовая схема веб-сайта VerticalLoop

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

Light Lime: #abd699

Fresh Lemon: #ffe26a

Teal: #75c9b7

Mint: #c7ddcc

Navy: #16123f

5. Jewel Tones – Regent5 Website Цветовая схема

Источник: Pantone.com

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

Mauve: #A96762

Deep Blue: #2F5C8F

Mandarin: #d85c27

Lavender: #b999be

Night Moon: #14365d

6. Sorbet – Mamma Цветовая схема веб-сайта Mia

Источник: Fashionista.com

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

Creme: #f4d8ae

Tangerine: #dc7027

Pistachio: #b6c48e

Peachy: #ea8a81

Black Cherry: #301008

7. Orchid – Gong Website Цветовая схема

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

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

Soft Lilac: #F6EBF4

Purple: #482673

ORCHID: #ED0B70

DIGI DENIM: #3018

DIGI DENIM: #3018

DIGI DENIM: #3010013

Digi Denim: #301008

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

8 новых цветовых схем на 2021 г.

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

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

1. Инфракрасный и фиолетовый

Bright Red: #DE354C

Deep Red: #932432

Pure Purple: #3C1874

Purple Tinged Grey : #283747

Cloud: #F3F3F3

 

2 .

Earthtone Red and Green

Красная выделение: #B73225

Blue Minded: #004E7C

Maroon 6: #591COB

GREY WATER: #591COB

GREY WATER: #591COB

: #591COB

.0036 #DCE1E3

3. Цветовая схема TAN + зеленый веб -сайт 2021 от Gatto Web

Макияж загар: #DDAF94

. Блуш: #E8CEBF

. #4F4846

Слегка от белого: #FDF8F5

4. Классическая двойная синяя цветовая схема

Dark Blue: #12232E

СИНИЙ0035 Lightest Blue: #4DA8DA

Shadow of Dark Blue: #203647

Shadow of Light Blue: #EEFBFB

 

5. Greyscale + One (Yellow) 2021 Website Color Scheme

Blackish: #202020

Dark Grey: #3F3F3F

Medium Grey: #707070

Egg Yellow: #FFD6C

White: #FFFFFF

 

6.

Greenery + Gradients Website Color Scheme 2021 Анна Сенькова

Темно -зеленый: #164A41

Средний зеленый: #4D774E

Светло -зеленый: #9DC88D

Natural Yellow: #9DC88D

Natural Yellow: #9DC88D

Натуральный желтый: #F1B24A

: #F1B24A

. Зеленое + Жемчужное веб -сайт Цветовая схема 2021 от восхитительных дизайнов

Олив: #A3BCB6

Зеленый лист: #39603d

Brown Grey: #3C403D

TANLY: #3C403D

TANLLY: #3C403D

TANLLY: #3C403D

.0013

Белый: #FFFFFF

Цветная доска настроения на 2021 год

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

---

Вот исходный пост! Цветовые схемы веб-сайтов 2020-2021

Веб-дизайн может быть веселым!

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

Вот почему мы отобрали лучших из лучших 50 эпических цветовых схем из самых дальних уголков Dribbble, Awwwards, Pinterest, Behance и нескольких отличных блогов.

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

Summer 2020 Update – 13 New Website Color Schemes for 2020

1. Minimal Colors, Soft Beach by Duminda Perera

Bright blue: #51e2f5

Blue Green: #9df9ef

Dusty White: #EDF756

Розовый песок: #FFA8B6

Темный песок: #A28089

2.

Минимальные цвета — фиолетовая 90 -м.0035 Замораживание фиолетового: #e5eaf5

Средний фиолетовый: #D0BDF4

Фиолетовой боли: #8458B3

Heavy Purple: #A28089

Deavy Perpale: #A28089

. #FF1D58

Сестра сестра: #F75990

Crown Yellow: #FFF685

Blue Light: #00ddff

Brutal Blue: #00ddff

Brutal Blue: #00ddff

Brutal Blue: #00dff

. Цветовая схема от Sajon

Ярко оранжевый: #FF1E00

Dimly Blue: #E8F9FD

Блютировка/выделение зеленого цвета: #59CE8F

5. 5. КОЛОНСКАЯ СВОРТА СКИМЕССКОЙ СКИМЕЙ.

#f43a09

Дедушка Оранжевый: #ffb766

Серый Синий Зеленый: #c2edda

Живой Зеленый: #68d388

Веб-сайт Renene Banking and Finance 9 Coloring and Finance

0011

Pinky: #FBE3E8

Blue Greeny: #5CBDB9

Teeny Green #beef00

Electric Red: #ff0028

Deep Green: #657a00

Power Blue: #1400c6

0 1 901 желтый, белый цвет0035 Справочный загар: #feect1

Purple-y: #7d3cff

Желтые перчатки: #F2D53C

Redhead- #C80E13

Bleath Sand Tan: #e1b382

Sand Tan Shadow: #c89666

Night Blue: #2d545e

Night Blue Shadow: #12343b

10.

Tan, pink and red color scheme

Ragin Бежевый: #FFF5D7

Корал Розовый: #FF5E6C

Sleathe Yellow: #Feb300

Pink Leaf: #ffaaab

11. Pink, Green, и Purple Leaf:

. : #9BC400

ГОРЯЧИЕ ГОНГА МЕЖДЕНИЯ: #8076A3

Ми туманная гора Розовый: #F9C5BD

Фабрика Пурпуль0011

Зеленая трапа: #478559

Фиолетовая базовая линия: #161748

Розовый ближний

Желтый фон: #FFDE22

Розовый / Красный Круг: #FF414E

Оранжевый круг: #FF8928

White Layover: #ffffffff

2013 2019.0023

1. 70’s Inspired — Modern Color Palette

Горная тень. Синий: #101357

Старый макияж Розовый: #FEA49F

Голден Желтый: #FBAF08

BLIGELLELL: #FBAF08

.

Bold 2019 Green: #007f4f

2. Lightning Blue Purple – простая цветовая палитра Web

Lightning Blue: #51d0de0035 Brain Wrinkle White: #d9d9d9

3. Metallic Blue, Purple, Red – Website Color Palette

Blue Popsicle: #0f2862

Redline: #9e363a

Purple Shadow: #091f36

Grey Blue Leaf: #4f5f76

4. Apricot Avalanche – Web Design Color Schemes

Blueberry: #6B7A8F

Apricot: #F7882F

Citrus: #F7C331

Apple Core: #DCC7AA

5. Сильный контраст и достоверность

. -Orange: #fc5226

6. Classic Red Gold Website Color Palette

Redder than you: #ff3a22

Goldi-lots: #c7af6b

Darker Gold: #a4893d

Silver Tongue : #628078

7.

Тонкая и сочная веб-цветовая схема

Едва зеленые: #ACB7AE

Коричневые майки: #82716E

Tan Blonde: #82716E

Tan Blonde: #E4DEC

Tan Blonde: #E4DEC

Tan Blonde: #E4DEC

.

8. Фотографическая память

Зеленая гора: #3D7C47

Голубая гора: #09868B

Светло -голубой фона: #76C1D4

5555. Барли: #76C1D4

55555555555.0013

9. Futuristic Lightbrite

Grey silver: #bccbde

Lightsaber Blue: #c2dde6

Purple: #431c5d

Orange: #e05915

Yellowbrite: #cdd422

10. Trapper Keeper Red & Purple

Painful Red: #eb1736

35 Years Old Purple: #5252d4

Светло-фиолетовый на градиенте: #7172dd

50035 Shadow Purple Red: #781A44

11.

Сэндвич с пасхальным яйцом

Зеленый: #8BF0BA

Иронический Блюз: #0E0FED

BLUE BENTLING: #0E0FED

BLUE BENTLING: #0E0FED

BLUENTLING: #0E0FED

.

Желтые яйца: #ffdc6a

---

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

---

Оригинальный набор цветовых схем веб -сайта:

1. Интеллектуальная некачественная нехватка

. Насыщенный красный: #e62739

Цветовые палитры Trendy Web на сайте Awwwards

2. Extra Snug

French Laundry Blue: #3a4660

Комфортный загар0036 #C9AF98

Peachy Kreme: #ED8A63

Brown Bonnet: #845007

Найден на рубашке DESI от Filip Dueskau на Behance

3.

Dark Horse19 9?

Silver Fox: #D4D4DC

Глубокий матовый серый: #393F4D

Dark Slate: #1D1E22

Найден на концепции Vintage Rides.0011

Проще говоря, зеленый свет: #7DCE94

Стрелка темно-серой: #3D3D3F

WATILLE GREY: #F6F5F3

WHILE-WALE-ISH : #F6F3F3

White-white-white-white-ilsh : #f6f3f3

. /G для Disney

5. Драгоценные металлы

Розовое золото: #BD8C7D

Мягкое золото: #D1BFA7

Silver: #8E90

на #.11111111.129.11129.11129.11129.11129.129.129.129. от Socio Design

6. Европейские тела

Желтая рука: #FBF579

Lonely Blue: #005995

Стационарный розовый красный: #FA625F

. Sparkle Mag

7. Simple Brilliant Accents

Red Overlaid: #cd5554

Photographed Brown: #

a

Algae Green: #00c07f

Heritage Blue:  #313d4b

Найдено на веб-сайте Inspiration by Mind Sparkle Mag

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

---

Часть вторая. Наблюдения за взаимодействием и цветом в контексте

---

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

8. Синий Красный

Темно-красный: #b11a21 – В наложении, наложенном на плоский синий, фотографический фон придает глубину.

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

Синие бобы: #7acfd6 — Плоский синий контрастирует с фотографией за красным.

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

Найдено на веб-сайте Inspiration by Mind Sparkle Mag

9. Солнечно и спокойно

Утреннее небо: #CAE4DB. Никогда не недооценивайте цветовую палитру, созданную с помощью фотографии, чтобы задать тон вашему дизайну.

Honey: #DCAE1D — В этом случае палитра устанавливается вместе с фотографией, а затем повторяется в подзаголовке.

Cerulean: #00303F — Cerulean невероятно элегантен в качестве альтернативы черному или темно-серому цвету, если используется постоянно.

Туман:  #7A9D96 – Этот чистый, естественный цвет показан на фотографии, но его можно использовать и на нижнем блоке полной ширины или на кнопках.

Найдено на веб-сайте Inspiring Color Schemes от Canva

9. Темно-оранжевый

Темно-серый: #393939 – Темный дизайн требует немного больше внимания, но при правильном использовании может обеспечить много контраста.

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

Светло-оранжевый: #ec7f37 — Использование иллюстративных элементов требует некоторой гибкости для естественной светлоты и темноты для контурирования объектов.

Оранжево-желтый:  #be4f0c. Использование цвета на цветовом круге может сделать палитру стильной, смелой и сдержанной.

Найден в великолепных цветовых схемах с помощью одного дополнительного пикселя

10.

Скрипучий

Свежий: #4ABDAC — еще раз цвет, наложенный на фотографические элементы, придает стильный современный вид

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

Солнечный свет: #F7B733 — желтый служит только призывом к действию и выделяет важные части в этих резких выстрелах в голову.

Найдено на веб-сайте Inspiring Color Schemes от Canva

11. Базовый сине-зеленый

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

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

Dark Slate: #33363b — Разбивка пустого пространства более темным заголовком, нижним колонтитулом или разделами во всю ширину позволяет избавиться от слишком повторяющихся вещей.

Светло-серый: #eaeaea — это одна из самых распространенных цветовых схем на веб-сайте, особенно для технологических компаний. Вам это еще не надоело? Мне это нравится.

Найдено на бесплатных потрясающих темах WordPress от ColorLib

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

---

Часть третья – Об отсутствии цвета и хорошо выполненных однотонных цветовых схемах

---

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

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

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

12. Старший контраст

Сланец: #262626 — Повторите после меня, все серые не равны

Серый: #3F3F3F

Whitish: #F5F5F5F5F5F5F5F5F5F5F5F5F

. не равны

Светло -серый: #DCDCDC

Найден на одной странице любви, созданная Питером ТОТ

13. Истинный черно -белый + фотосъемка

Черный: #000000

Белый: #fffffffffffffffffffefffffeff

Found on Web Design Ledger – 20 Beautiful Portfolio’s, Work by Michael Schmid

14.

Goldifox

Golden wheat: #a39274

Soft Wheat : #dfd8c8

Deep gray: #252523

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

15. Свежий мятный

Новый: #4cb69f

Оттенок серого: #f5f5f5

Темно-фиолетовый: #201d3a – Не совсем черно-белый+1 – Оттенок фиолетового в углу фотографии

16. Blue + White

Оптимизм синий: #269CCC

Синие водоросли: #9ED2C5

Flat Grey: #7B7B7B7B5

Flat Grey: #7B7B7B7B5

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

16. Экспериментальная простая фотография — квадратные разделения t Plastic’

18.

Прямоугольник вокруг букв, творческий блок букв

 

Найдено на Behance, автор: Diana Polar

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

---

Часть четвертая – О взаимодействии типографики и цвета

---

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

19. Угольно-черный, золотой и много белого

Золотистый верх:  #d8ab4e

Золотистый низ: #b48c36

Темно-серый: #040404

19B. Сочетания шрифтов, дополняющие выбранные цвета — Gin Rough и Amiri

Gin Rough — от Fort Foundry, доступны на MyFonts — взяв высококачественный золотой градиент и соединив его с типографскими элементами очень преднамеренной формы, дизайнеры этого шрифта сайт сочетал в себе строгость и элегантность.

Amiri Rough — доступен через Google Fonts — выглядит великолепно в качестве отзыва или цитаты.

Найден на веб -дизайне вдохновения для клубов Gentlemen Barber (вам нужно увидеть полный сайт)

20. Чистый хаки Красный

Хлопковый красный: #C53211

Чистый серый: #2E3830

. : #e6dbc9

20B. Комбинации шрифтов, дополняющие выбранные цвета — Futura Bold и Museo Slab

Futura Bold — настолько же классика, насколько и проста. Обычные похожие шрифты, такие как Gotham Black, Montserrat или Proxima Nova, могут дать вам похожий, но другой вкус. Тем не менее, шрифт Futura Bold будет полезен во многих ситуациях – он хорошо сочетается с простой красной, серой и коричневой цветовой гаммой в качестве заголовков в верхнем регистре.

Museo Slab — как вес 100 в цитате выше, так и текст абзаца (начертание шрифта: 400), Museo Slab обеспечивает удобочитаемость, будь то большой или маленький. Futura, Museo Slab поверх этих удобных простых цветов кажутся не обязательно классическими, но современными и оригинальными. Сдержанность как в выборе цвета, так и в типографике приводит к очень сплоченному ощущению, благодаря которому весь веб-сайт кажется интегрированным и фирменным.

21. Hip Modern Pastels

Pastel Peach: #DEA6AF

Небо синий: #8CBCD0

PASTEL PINK: #E6DBC9

PASTEL Pin Сочетание шрифтов, дополняющее цвет Выбор – Калибр – Европейский дизайн Ketchup

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

 

Дизайн, представленный на конкурсе CSS Design Awards   – купите шрифт Calibre

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

Несколько слов ободрения

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

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

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

[bctt tweet=»«Величайшие дизайнеры тоже гадали и попытались создать что-то новое».»]

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

Часть пятая – Что такое современная цветовая палитра?

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

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

22. Электронная современная цветовая палитра

Темно -синий/фиолетовый: #111C30

Темно -розовый макияж: #9A4D55

Комфортный куш Beige: #80756B

.

Tiny Sweet Blue: #B5E9E9

Кремовый светлый загар: #FEF6DD

Pinkie Pie: #FFE1D0

Желтая лошадь: #FFF1B5

Green Thumb: #D -FFF1B5

.

Deep Purple: #1D1145

Trapper Keeper Green: #0DB4B9

Розовый ботинок: #F2A1A19

Современный розовый бэкпак: #E769

Современный розовый Backpack: #E76.

.0011

Красные ветви: #DE493C

Зеленые деревья: #608074

Синий/зеленый туман: #DAEFD9

26. A Rusted Modern Color Palette

. Deep Rugle Rust Rusted . Серебряный головной убор: #4b6777

Ржавое золото: #ce9e62

Черный для контраста: #2c2c2c

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

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

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

Color Supply 

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

Охладители

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

Генератор палитр

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

Paletton 

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

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

Часто задаваемые вопросы о цветовых схемах веб-сайтов

Какой цвет лучше всего подходит для веб-сайта?

Синий, безусловно, самый безопасный выбор, так как наибольшее количество людей назвали его любимым (35%). Однако ясно, что если все ваши конкуренты используют синий цвет, может иметь смысл «дифференцировать» ваше предложение и бренд. Цвета вашего бренда должны быть привлекательными, и «белое пространство» является важной частью этого. Убедитесь, что вы оставляете место для элементов, которые вы включаете, имеете контраст между текстом и фоном и не перегружаете посетителя — пытаясь быть слишком ярким или новым только ради новизны.

Сколько цветов должно быть на сайте?

Учтите, что 51% брендов выбирают монохромные логотипы, 39% используют двухцветные, и только 19% компаний выбирают полноцветные логотипы. Помимо фотографий, 1-, 2- и 3-цветные веб-сайты, кажется, легче сделать хорошо, чем пытаться сделать веб-сайт с радугой цветов. При этом, если у вас есть профессиональный дизайнер, Microsoft и Google явно считают, что работать с большим количеством цветов полезно, поскольку они оба используют как минимум 4 сплошных цвета в своем дизайне.

Почему мне следует подумать о найме профессионального дизайнера веб-сайтов?

Выбрать цветовую схему сложно, но в дизайне веб-сайта есть гораздо более сложные проблемы, которые могут выиграть от помощи опытного дизайнера. Профессиональные веб-дизайнеры перепробовали сотни способов и поняли, какие методы работают, а какие нет. В идеале, если вы работаете с такой командой, как Hook Agency, они также проводят A/B-тестирование веб-сайтов, вносят изменения на основе аналитики и знают, как сделать ваш сайт легко найти в Google.

Вы открыли секретный люк во внутреннюю работу Интернета! 😉

Мы знаем, как делать удивительные вещи, такие как это очень классное дополнение FAQ к нашему списку здесь, в Google. Мы знаем, как управлять вашим веб-сайтом в Google с помощью практики, называемой «Поисковая оптимизация», поэтому, помимо цветовых схем веб-сайта, мы знаем, как ПРИВЛЕЧАТЬ БИЗНЕС с помощью трафика Google. Если вы хотите работать с профессиональной командой веб-дизайнеров, отправьте нам сообщение по адресу [email protected]!
Еще одна тактика, которую мы используем для оптимизации ранжирования, — это нечто, называемое взаимосвязью. Так что, если вы когда-нибудь задавались вопросом, кто самый сексуальный мужчина в Миннесоте, или хотели прочитать руководство по поисковой оптимизации для сантехников, прочтите их!

Теория цвета и цветовые палитры: все, что вам следует знать

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

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

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

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

 

Содержание

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

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

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

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

 

Что такое цветовой круг?

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

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

Почему, спросите вы?

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

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

 

Источник: 99designs

 

7 важных цветовых терминов, которые вы должны знать

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

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

 

1. Оттенок: относится к цвету объекта. Например, черный или синий?

 

 

2. Насыщенность: представляет силу или слабость используемого цвета.

 

 

3. Цветность: определяет чистоту цвета и то, сколько черного, белого и серого добавлено к нему или отсутствует.

 

 

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

 

 

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

 

 

6. Оттенок: можно добавить оттенок к оттенку, смешав его с белым.

 

 

7. Значение: показывает, насколько светлым или темным является оттенок. Значение используется для создания фокуса на изображении.

 

 

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

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

 

1. Монохроматические цветовые палитры

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

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

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

 

 

2. Аналоговые цветовые палитры

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

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

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

 

 

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

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

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

 

4. Триадные цветовые палитры

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

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

 

 

10 Широко используемых цветов и их значений

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

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

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

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

 

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

  34 :

  творчество, интеллект, инициатива, энтузиазм
• Серый: элегантность, неуверенность

 

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

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

 

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

Итак, вы знаете, что такое цветовые круги и цветовые палитры, но как создать собственную цветовую палитру?

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

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

 

1. Поиск цвета

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

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

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

 

Источник: Color Hunt

 

2. Цвета Muzli

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

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

В любом случае результат будет отличным и привлекательным!

 

Источник: Muzli Colors

 

3. Colorbox

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

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

 

Источник: ColorBox от Lyft Design

 

Key Takeaway

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

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

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

После этого раскрасьте свою историю красками!

Список палитр

Список палитр

Логин Зарегистрироваться

Внимание! Для использования этого веб-сайта требуется современный веб-браузер.

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

Отправить

| Очередь отправки | API

отправить

4 в очереди, 91 в ожидании

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

NEW Теперь вы можете просматривать понравившиеся палитры!

аасдф аасдф аасдф

Количество цветов:

AnyMaxMinExact

Поиск по тегу:

Предлагаемые теги: оборудование, художник, компьютер, геймбой

Сортировка:

По умолчаниюA-ZЗагрузкиНовые

Создано порцирелиус

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

148

147

нравится

• #горько-сладкий
• 4 цвета
• 1018 загрузок

• Пример по порцирелиус

Теги: художник, розовый, porcirelius

Создано Orca-Arts

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

• #ржавчинамедь
• 6 цветов
• 0 загрузок

Создано SteamC68

Как фанату Квентина Тарантино, мне нравится его цветовая гамма. Его цвета ненасыщенные, но не всегда. Кроме того, у него есть своя специфическая красная, желтая, синяя и коричневая цветовая гамма на протяжении всей его 9фильмы, которые я нахожу действительно интересными. В любом случае, я хотел сделать цветовую палитру, в которой было бы большинство цветов Квентина. Эти цвета чаще всего встречаются в следующих фильмах: «Однажды… в Голливуде», «Бесславные ублюдки», «Омерзительная восьмерка» и «Джанго освобожденный».

• #quentinscolorpalette
• 32 цвета
• 7 загрузок

Теги: ненасыщенный, свежий, пыльный, винтаж, разноцветный

Создано 🍄точки🍄

Тяжелая палитра, предназначенная для загнивающего искусства.

• #золотая трясина
• 10 цветов
• 19 загрузок

• Пример по 🍄точки🍄

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

Создано 🍄точки🍄

Беззаботная кремовая палитра, предназначенная для летних вещей.

• #мороженое
• 7 цветов
• 33 загрузки

• Пример по 🍄точки🍄

Теги: мороженое, пляж, синий, розовый, зеленый, бирюзовый, крем, лето, конфеты, lisafrank

н. э. | присоединяйтесь, чтобы убрать рекламу!

Представлено Юхо

Это расширенная версия первой палитры Dewdrop Dynasty, в ней 96 цветов. Эта палитра содержит больше серых тонов, а также более темные и светлые варианты цветов исходной палитры. Это более полезно, так как теперь вы можете сделать более темный фон для хорошего эффекта параллакса. Вся палитра вдохновлена ​​инди-игрой Dewdrop Dynasty, автором которой является Goodgis. https://store.steampowered.com/app/1444080/Dewdrop_Dynasty/

• #dd96
• 96 цветов
• 47 загрузок

Теги: неон, dewdropdynasty, nes, ретро, ​​goodgis, 48, juho, 96, dd48

Создано Печу

Палитра с балансом между тусклостью и яркостью.

• #утреннее сияние
• 24 цвета
• 16 загрузок

Создано эзотерическая кошка

Большая палитра с (в основном) драгоценными оттенками, вдохновленными природой.

• #jeweltoneappalachia28
• 29 цветов
• 45 загрузок

Теги: драгоценный камень, драгоценные камни, природа, пейзаж, большой, открытый, жирный

Создано Энонигмус

Хорошая 32-цветная 12-битная палитра глубины. Серые и коричневые рампы можно использовать друг с другом для AA.

• #enon32
• 32 цвета
• 98 загрузок

Создано Тоби_Яша

Палитра, имитирующая внешний вид старых/ретро-игр.

• #tyrp30
• 30 цветов
• 31 загрузка

Теги: ретро, ​​прочее, старое, ностальгия

Создано Делает

• #городской фильтр
• 15 цветов
• 38 загрузок

Теги: город, фильтр, аниме, ночь, урбан

Для текущего выбора больше нет палитр.

Что вы думаете об этой странице?

н.э. | присоединяйтесь, чтобы убрать рекламу!

	СЕССИИ	ПОЛЬЗОВАТЕЛИ	ПРОСМОТРЫ СТРАНИЦЫ

20 цветовых палитр для дизайна вашего бренда

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

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

Будь то желтый цвет арок McDonald’s или зеленый логотип Starbucks, цвет оказывает психологическое воздействие, которое необходимо учитывать при разработке бренда. Как руководитель отдела креативного дизайна Vyond, я регулярно применяю основы восприятия цвета, чтобы помочь нашей компании связаться с нашей целевой аудиторией. В этом посте я объясню влияние цвета на восприятие и помогу вам найти палитру, которая лучше всего передает индивидуальность вашей компании и привлекает основную аудиторию.

Психологическое воздействие цвета

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

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

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

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

20 вариантов цветовой палитры для каждой компании Тип

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

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

Вспомогательные компании: синие и розовые

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

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

Полностью натуральные компании: Земные тона

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

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

Лучшие технологические компании: красные, желтые и оранжевые

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

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

Компании-мечтатели: яркие оттенки

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

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

Планирующие компании: Синяя, черная и коричневая

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

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

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

 

Как использовать цветовую палитру в Vyond

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

Клиентам Vyond легко создавать фирменные видеоролики в Vyond Studio. Наш стиль современной анимации на 100 % настраивается по цвету. Просто введите HEX-коды для каждого цвета в палитре вашего бренда, и наш продукт найдет именно тот оттенок, который вы ищете, а затем применит его в вашем видео.

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

 

Выполните следующие действия:

• Войдите в свою учетную запись Vyond или воспользуйтесь бесплатной пробной версией
• НАЖМИТЕ ЗДЕСЬ, чтобы открыть это видео в качестве шаблона проекта в своей учетной записи
• Сохраните цветовую палитру, которую хотите использовать в качестве шаблона сцены
• Добавляйте этот шаблон сцены к каждому новому видео и получайте доступ к своим фирменным цветам на панели быстрого доступа.

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

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