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

· Инструмент для подбора цветов и генерации цветовых схем ·

Схема:
Насыщенность/Яркость

Схема:
Контрастность

Выбранный Вариант:
Насыщенность/Яркость

Постоянный адрес текущей цветовой схемы:

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

Также монохроматические вариации сделаны для каждого цвета в других схемах.

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

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

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

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

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

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

Источник

Лекция 4. Цветовые коды. Работа с цветом в образе и силуэте

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

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

Схема «Отрезок через центр круга»

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

Схема «Отрезок»

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

Схема «Треугольник равносторонний»

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

Схема «Треугольник остроугольный»

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

Схема «Прямоугольник»

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

Схема «Квадрат»

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

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

Работа с контрастами.
Влияние контрастов на силуэт

→ дополняющие цвета (желтый / фиолетовый, синий / оранжевый, зеленый / красный)

→ теплые (красный, желтый, оранжевый) и холодные (синий, фиолетовый, голубой) цвета

→ яркие и нейтральные (красный и бежевый, синий и дымчатый)

→ светлые и темные (бледно-желтый и фиолетово-черный)

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

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

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

​Работа с оттенками.
Влияние оттенков на силуэт

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

→ аналогичные или оттеняющие (желто-оранжевый и оранжевый)

→ нейтральные (серый, бежевый)

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

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

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

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

Сочетание 3 и 4 оттенков. Балансировка силуэта

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

Правило сочетания цветов, которое действует всегда:

3 цвета + 1 акцент = максимум 4 цвета (в схемах цветового круга)

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

Ключевые цветовые семейства

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

Нейтральные

Нейтральные: черный, бежевый, нюдовый, молочно-белый, терракотовый, коричневый, белый.

Темные: черный, серый, бордовый, синий, хаки.

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

Яркие

Осенние: теплые тминный, бордовый, сине-зеленый, молочно-белый.

Летние: фруктовые и яркие лимонный, лазурный, ярко-розовый, зеленый.

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

Романтические

Романтические: цветочные и растительные сиреневые, фиалковые, розовые, салатовые, желтые.

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

Ключевые цветовые коды

Цветовой код – это устоявшееся цветовое сочетание, которое вызывает у человека определенные ассоциации. Коды могут вызывать положительные или отрицательные эмоции и относиться не только к моде. Например, желтый и красный могут ассоциироваться с Макдональдсом, черные и желтые – с предупреждающими вывесками или Билайном. Также к нежелательным цветовым кодам можно отнести пары черный + оранжевый (Хэллоуин), зеленый + красный (Новый год).

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

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

Красный + серый: городской код, элегантный casual и спорт, современный контраст, более мягкий, чем черно-белый.

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

Красный + синий: легкое спортивное сочетание, casual городской гардероб.

Новые цветовые коды

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

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

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

Мы рассмотрели несколько ключевых и несколько новых цветовых кодов с красным цветом. Аналогичную раскладку можно сделать для всех основных цветов цветового круга. Если вы хотите узнать про какой-то из них, вы можете оставить свой комментарий под статьей или написать нам отзыв через форму обратной связи. Мы обязательно расскажем подробнее и приведет примеры цветовых кодов для интересующего вас цвета.
​
Следующие лекции IFM будут посвящены видам фигур и работе с ними и мужскому стилю. Следите за новостями Rendez-Vous Daily по хештегу #IFM4rendezvous, чтобы не пропустить полезные лекции.

Источник

Таблица цветовых кодов RGB

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

Таблица цветовых кодов RGB

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

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

Красный, зеленый и синий используют по 8 бит каждый, которые имеют целочисленные значения от 0 до 255. Это дает 256 * 256 * 256 = 16777216 возможных цветов.

RGB ≡ красный, зеленый, синий

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

Когда красный пиксель установлен на 0, светодиод выключен. Когда красный пиксель установлен на 255, светодиод будет полностью включен.

Любое значение между ними устанавливает частичное излучение светодиода.

Цветовой формат и расчет RGB

Код RGB имеет формат 24 бита (биты 0..23):

Примеры расчетов

Белый цвет RGB

White RGB code = 255*65536+255*256+255 = #FFFFFF

Синий цвет RGB

Blue RGB code = 0*65536+0*256+255 = #0000FF

Красный цвет RGB

Red RGB code = 255*65536+0*256+0 = #FF0000

Зеленый цвет RGB

Green RGB code = 0*65536+255*256+0 = #00FF00

Серый цвет RGB

Gray RGB code = 128*65536+128*256+128 = #808080

Желтый цвет RGB

Yellow RGB code = 255*65536+255*256+0 = #FFFF00

Источник

Сочетание цветов

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

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

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

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

Вторичные цвета создаются путем объединения основных цветов в равных частях:

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

Значение цветов

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

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

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

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

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

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

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

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

Источник

Вокруг цвета: как подобрать палитру в веб-дизайне

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

Ликбез: что важно учитывать

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

Цветовой круг: гармония, тёплые и холодные цвета

Самый примитивный вариант цветового круга

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

Другие варианты гармоничных цветовых схем

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

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

Культурный контекст

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

Танец дракона в Китае

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

Цвет как инструмент управления вниманием и настроением

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

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

Фрагмент интерфейса Telegram

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

Сообщение об успешном завершении регистрации

Синий. Синий цвет в веб-дизайне по данным исследования Джо Халлока предпочитает 42% пользователей. Он создаёт нейтральный фон и вызывает чувство доверия, спокойствия и безопасности. Именно поэтому многие соцсети и мессенджеры выбирают его в качестве основного. Кроме того, дальтоникам легче увидеть синие оттенки.

Синий в интерфейсе ВКонтакте

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

Тёмный режим в Google Chrome

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

Большая часть интерфейса — оттенки серого

5 модных сочетаний цветов в веб-дизайне

В 2021 году в тренде яркие естественные тона, неожиданные гармоничные сочетания, приглушенные оттенки и природные палитры.

Выделяющаяся насыщенность

Насыщенные цвета в сочетании с более блёклым фоном, который делает их ещё более яркими — трендовая комбинация этого года.

Оттенки человеческой кожи

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

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

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

Сюрреалистичность

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

Монохром плюс один

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

8 полезных сервисов

ColorScheme

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

Paletton

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

Coolors

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

Adobe Color

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

DeGraeve

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

Palette Generator

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

Pallettable

Подбор цветов превращается в увлекательную игру — сервис предлагает выбрать нравится или не нравится вам оттенок.

Flat Color Palettes

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

Немного литературы

Если вы хотите вникнуть поглубже и стать гуру в области колористики, то вот парочка полезных книг:

Вместо заключения

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

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

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

Ликбез: что важно учитывать

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

Цветовой круг: гармония, тёплые и холодные цвета

Самый примитивный вариант цветового круга

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

Другие варианты гармоничных цветовых схем

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

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

Культурный контекст

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

Танец дракона в Китае

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

Цвет как инструмент управления вниманием и настроением

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

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

Фрагмент интерфейса Telegram

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

Сообщение об успешном завершении регистрации

Синий. Синий цвет в веб-дизайне по данным исследования Джо Халлока предпочитает 42% пользователей. Он создаёт нейтральный фон и вызывает чувство доверия, спокойствия и безопасности. Именно поэтому многие соцсети и мессенджеры выбирают его в качестве основного. Кроме того, дальтоникам легче увидеть синие оттенки.

Синий в интерфейсе ВКонтакте

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

Тёмный режим в Google Chrome

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

Большая часть интерфейса — оттенки серого

5 модных сочетаний цветов в веб-дизайне

В 2021 году в тренде яркие естественные тона, неожиданные гармоничные сочетания, приглушенные оттенки и природные палитры.

Выделяющаяся насыщенность

Насыщенные цвета в сочетании с более блёклым фоном, который делает их ещё более яркими — трендовая комбинация этого года.

Оттенки человеческой кожи

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

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

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

Сюрреалистичность

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

Монохром плюс один

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

8 полезных сервисов

ColorScheme

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

Paletton

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

Coolors

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

Adobe Color

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

DeGraeve

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

Palette Generator

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

Pallettable

Подбор цветов превращается в увлекательную игру — сервис предлагает выбрать нравится или не нравится вам оттенок.

Flat Color Palettes

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

Немного литературы

Если вы хотите вникнуть поглубже и стать гуру в области колористики, то вот парочка полезных книг:

Вместо заключения

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

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

Источник