Как добавить цветовой круг в фотошоп. Модель HSB (Цветовой круг). Совместим с Photoshop CS6, CC и более

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

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

Чтобы открыть палитру Kuler , выберите команду меню Окно — Расширения — Kuler (Windows — Extensions — Kuler)

Примечание

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

Внимание!

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

Интерфейс палитры Kuler

Расшифровка сносок:

Пункт 1 — Поле ввода поискового запроса.

Пункт 2 — Раскрывающиеся списки фильтров.

Пункт 3 — Темы.

Пункт 4 — Кнопка Просмотреть предыдущий набор тем (Previous).

Пункт 5 — Кнопка Просмотреть следующий набор тем (Next).

Пункт 6 — Кнопка Обновите темы в сообществе Kuler (Refresh).

Пункт 7 — Кнопка Редактировать тему в панели создания (Edit themes).

Пункт 8 — Кнопка Добавить данную схему в образцы (Add selected theme to Swatches).

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

Пункт 10 — Ползунковый регулятор яркости.

Пункт 11 — Cлева направо:

• Кнопка Добавить текущий основной цвет как базовый (Add foreground color as base).
• Кнопка Добавить текущий цвет фона как базовый (Add background color as base).
• Кнопка Изменить другие цвета темы по законам гармонии (Apply harmony).
• Кнопка Добавить в тему новый цвет (Add color).
• Кнопка Удалить данный цвет из темы (Delete color).

Пункт 12 — Кнопка Загрузить цветовую тему на веб-сайт Kuler (Upload)

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

В верхней части палитры расположены три кнопки:

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

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

Чтобы использовать определенную тему, то есть импортировать ее цвета в программу фотошоп, выделите ее, в затем щелкните по кнопке Добавить выбранную схему в образцы (Add selected theme to Swatches) — пункт 8 .

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

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

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

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

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

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

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

Заметили ошибку в тексте - выделите ее и нажмите Ctrl + Enter . Спасибо!

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

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

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

Итак, какие же бывают «цветовые круги»?

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

При работе с инструментами Photoshop опираться на этот круг нельзя. С точки зрения физики и физиологии — он пострен криво и неправильно. Но давайте по порядку.

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

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

В реальной жизна стимулы гораздо более сложные и описываются спектральным распределением энергии. Если это распределение равномерно, то стимул выглядит ахроматическим, а проще говоря — серым. При достаточно большой яркости мы примычно называем его белым. При этом белый луч можно разложить в спектр, который так же по привычке часто называют радугой. Что и было сделано при помощи призмы. В 17 веке Исааком Ньютоном, а в 20 — художником, оформлявшим обложку альбома The Dark Side of the Moon группы Pink Floyd.

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

Поэтому лучше расположить цвета так, как это сделано на левом круге. Правильным является именно такое расположение: красный вверху, по часовой стрелке за ним идет желтый и т.д. Именно по такому кругу откладывается значение цветового тона (Hue) в цветовых моделях HSB и HSL. Я специально отзеркалил и развернул круг Иттена, чтобы совместить красные цвета и обеспечить соответствующий переход оттенков. Это наглядно показывает насколько он неравномерный.

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

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

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

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

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

Очень подробно об этом рассказывает Саша Чалдрян на первом занятии курса «Adobe Photoshop. Творческая ретушь» . Я же ограничусь только тремя небольшимы иллюстрациями из конспекта к этому занятию.

Родственные сочетания — монохроматические сочетания двух-трех соседних секторов круга.

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

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

Сразу вспомнилась картинка:

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

Возьмем зеленый и красный цвета на примере Валиры из близзовского Харстоуна и клубники (сама природа подобрала сочетание):

Круто, да? Значит, зеленый отлично сочетается с красным. А теперь посмотри какой ад получится, если сделать зеленую кнопку на красном фоне или красную кнопку на зеленом фоне:

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

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

Цветовой круг

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

Есть немало онлайн-сервисов на эту тему. Удобный — colorscheme.ru .

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

Color Guide

В иллюстраторе есть клевый функционал, который работает по принципу цветового круга и показывает сочетание цветов. Называется панелька Color Guide.

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

Adobe Color Themes

В самом фотошопе есть такой же функционал. Раньше это были просто темы (набор цветов), а потом к ним добавили и сам цветовой круг, и теперь панелька называется Adobe Color Themes

По радуге

Сам же я цвета подбираю по «радуге»: перетягиваю ползунок и забираю цвет.

В примере я подобрал красный, фиолетовый и оранжевый. Шкала («радуга») лишь помогает подобрать цвет c разным оттенком (H = Hue) и иногда результат не устраивает. Вот мне не понравился грязный и унылый оранжевый и я сделал из него чистый и клевый. Если нужно подобрать по насыщенности (S = Saturation) или по яркости (B = Brightness), то просто меняем шкалу.

Многие художники пользуются цветовой моделью HSB . Эта математическая модель очень удобна для подбора оттенков и цветов. Модель HSB основана на модели RGB , но имеет другую систему координат. Любой цвет в модели HSB определяется своим цветовым тоном (оттенком), насыщенностью (то есть процентом добавленной к цвету белой краски) и яркостью (процентом добавленной черной краски). Из перечисленных трех составляющих менее всего понятна насыщенность . Можно определить насыщенность как "живость" цвета. Чем более цвет насыщен, тем дальше он от серого. Белый, черный цвета, все оттенки серого имеют минимальную насыщенность.

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

Трехканальная модель HSB получила название по первым буквам английских слов Hue (Оттенок), Saturation (Насыщенность) и Brightness (Яркость) . Модель HSB универсально применяется для цветокорреции - в этом она незаменима. Во всех графических приложениях эта модель присутствует в том или ином виде. Достоинство этой модели состоит в том, что она создавалась не для мониторов или принтеров, а для людей. Ведь человек интуитивно воспринимает цвет, разделяя его на оттенок, насыщенность и яркость.

Модель HSB удобно представлять в виде цветового круга . Значение цвета выбирается как точка на круге (или вектор , выходящий из центра окружности и указывающий на данную точку). Различные оттенки располагаются по окружности, состоящей из 360 градусов. Красный цвет соответствует 0, желтый - 60, зеленый - 120, бирюзовый - 180, синий - 240 и пурпурный - 300 градусам. Точки на самой окружности соответствуют чистым (максимально насыщенным) цветам. Точка в центре соответствует нейтральному цвету минимальной насыщенности (белый, серый, черный - это зависит от яркости). То есть можно сказать, что угол наклона вектора определяет оттенок, длина вектора - насыщенность цвета . Яркость цвета задают на отдельной оси, нижняя точка которой имеет минимальную яркость, а верхняя - максимальную.

Модель HSB имеет довольно широкий цветовой охват. Он не так велик, как у Lab, но больше охвата CMYK. На изображении серым цветом залиты цвета модели HSB, выходящие за границы охвата CMYK.