Как в фотошопе узнать код цвета
Как определить цвет в Photoshop?
Photoshop является одной из наиболее популярных программ современности. Ей пользуются как любители, так и профессионалы. И у каждого пользователя когда-либо возникали различные вопросы по этому приложению. Мы неоднократно писали на нашем сайте о лайфхаках. В этот раз хотелось бы рассказать вам о том как искать определенный цвет. Допустим вы нарисовали какую-то картинку, разукрасили её и теперь вам нужно узнать чем вы это сделали. Ниже мы расскажем вам о том как определить нужный вам цвет.
Для начала загрузите необходимую фотографию, с которой вы будете получать определенный цвет.
Теперь выбираем инструмент пипетка. Обычно он располагается слева, по счету шестой сверху. Для того чтобы узнать цвет определенной точки, нужно зажать кнопку Alt на клавиатуре и нажать мышкой в нужном месте.
Для того чтобы узнать код цвета, нужно зайти в команду палитра и посмотреть его снизу.
Цветовой эталон — это незаменимый цвет при цветокоррекции изображения. С помощью него можно ставить контрольные точки. Все нужные факты переносятся в раздел инфо. Таким образом, вы лучше узнаете о нужных цветах изображения. При редактировании очень удобно.
Как определить цвет в Фотошопе
Вам понадобится
- Графический редактор Adobe Photoshop.
Инструкция
Если нужно определить цвет в какой-то точке уже существующего изображения, начните с загрузки его в редактор. Для этого предназначен диалог, вызываемый сочетанием клавиш Ctrl + O — с его помощью вам надо найти в компьютере файл изображения, выделить его и нажать кнопку «Открыть».
При необходимости определить цвет в какой-то точке на экране монитора загрузите в Photoshop копию изображения с экрана. Сделать это очень легко — нажмите на клавиатуре Print Screen, переключитесь в окно графического редактора, нажмите Ctrl + N, затем Enter и Ctrl + V.
После того, как изображение открыто в Photoshop тем или иным способом, включите инструмент «Пипетка» — нажмите клавишу с английской литерой I. Можно сделать это и щелчком по соответствующей иконке на панели инструментов графического редактора.
Наведите указатель мыши на нужную точку картинки. Если требуется определить цвет какого-то мелкого элемента, увеличьте изображение — нажмите сочетание клавиш Ctrl и «Плюс» нужное число раз. Когда понадобиться вернуть нормальный размер, используйте сочетание Ctrl + Alt + 0.
Нажмите левую кнопку мыши — графический редактор определит оттенок в точке курсора и установит его в качестве рабочего цвета. Если вам нужно получить результат в числовом представлении, откройте палитру цветов — кликните по иконке из двух пересекающихся квадратиков в нижней части панели инструментов. В открывшемся окошке выберите одно из численных представлений. Составные элементы разложения цвета в кодировках RGB и CMYK помечены здесь соответствующими буквами, а шестнадцатеричный код помещен в поле у значка решетки # у нижнего края окна.
Если вам требуется произвести обратную операцию, т.е. установить рабочий цвет по известному числовому представлению, используйте эту же палитру. Составляющие кодировок RGB и CMYK придется набирать вручную, а шестнадцатеричный код можно скопировать в источнике и вставить в соответствующее поле палитры. Цвет будет установлен, когда вы нажмете кнопку OK.
Глаз человека воспринимает цвет, ориентируясь на интенсивность трех составляющих: красной, зеленой и синей. Для этого используются рецепторы, называемые колбочками. Они значительно менее чувствительны, чем монохроматические рецепторы, носящие название палочек.
Инструкция
Возьмите фотоэлемент с красной границей фотоэффекта не короче 800 нанометров. Его кривая чувствительности должна быть линейной. Подключите элемент к измерительному прибору, учитывая его конструктивные особенности. Ими определяется, в частности, требуемая чувствительность прибора, наличие или отсутствие необходимости использования источника питания, соблюдения полярности, и т.п. Направьте фотоэлемент на лист белой бумаги. На него же направьте и источник света с цветовой температурой порядка 4000 кельвинов. Важно обеспечить, чтобы свет от источника не попадал в элемент напрямую. Не меняя расстояния от источника и элемента до листа, прикройте последний по очереди красным, зеленым и синим светофильтрами. Запишите показания измерительного прибора во всех трех случаях. Примите их за сто процентов интенсивности для каждого из первичных цветов.Как определить цвет в Фотошопе?
В графическом редакторе Adobe Photoshop есть инструменты, с помощью которых можно определить цвет в какой-либо произвольной точке загруженного изображения. Результат измерения можно получить как в численном представлении, так и в виде эталонного цвета для любого инструмента рисования. Предусмотрена и возможность обратной операции — зная числовое выражение цветового оттенка, вы можете задать его в качестве текущего рабочего цвета.
Вам понадобится
- Графический редактор Adobe Photoshop.
Инструкция
Как узнать код цвета в фотошопе — как в photoshop узнать код цвета на слое x?? — 22 ответа
В разделе Другие языки и технологии на вопрос как в photoshop узнать код цвета на слое x?? заданный автором Просватать лучший ответ это выдели слой x ткни пипеткой на слой затем 2 раза щелкни по цвету и посмотри код
Ответ от Павел Кравцов[гуру]выбрать слой и тыркнуть пипеткой. в палитре цветов код цвета будет высвечен.Как узнать цвет пикселя в фотошопе. Как определить цвет в фотошопе. Оставляем на фото только один цвет, а меняем все остальные
Часто бывает так: нашёл нужную картинку, а цвет не тот; или просто захотелось разнообразить привычное. Как заменить цвет в фотошопе на другой? Вопрос оправданный, ведь в фотошоп заменить цвет можно несколькими способами. Многое зависит от рассредоточенности определённого оттенка по всему изображению. Чем реже заменяемый цвет будет встречаться на других участках изображения, тем проще замена цвета в фотошопе.
А теперь давайте рассмотрим несколько способов и разберемся, как в фотошопе заменить один цвет на другой.
Первый способ самый простой и быстрый. Но и объект перекраски не должен быть слишком сложным. Например, возьмём фото лайма на столе. Фон почти однородный, зелёный цвет присутствует только на лайме. Фрукт круглый, перекрасить будет не сложно.
Открываем изображение в Photoshop и снимаем закрепление слоя щелчком правой клавиши мыши по изображению замка.
Над слоем с фото создаём новый прозрачный слой (Shift+Ctrl+N ). Вызываем инструмент «Кисть»/Brush (клавиша B ). Кисть лучше взять жёсткую. На панели управления вызываем свойства кисти и выбираем жёсткую, с чёткими краями мазка.
Цвет кисти выбираем тот, в который хотим перекрасить лайм. Возьмём, например, синий. Палитра находится на панели инструментов внизу. Вызывается двойным щелчком по значку. Перемещая ползунки на спектре, можно выбрать диапазон цвета. Тон цвета выбираем, перемещая белое кольцо в квадратном окне, где тон переходит из белого в чёрный.
Становимся на прозрачный слой, подбираем размер кисти клавишами Ъ — увеличить, либо Х — уменьшить и закрашиваем наш лайм.
Теперь изменим режим наложения слоя с «Обычный»/Normal на «Цветовой тон»/Hue . Сделать это можно на палитре слоёв. Таким образом, лайм изменит цвет.
Если зажать клавишу Ctrl и, подведя курсор к иконке слоя, щелкнуть один раз, зона закраски выделится. Теперь, не снимая выделение, можно менять цвет кисти и подбирать другие цвета. Закрашивать заново не нужно. Можно после выбора цвета нажать комбинацию клавиш
В следующем примере рассмотрим, как заменить цвет в фотошопе более качественно. Такой способ может занять чуть больше времени, но результат того стоит.
Как заменить один цвет на другой в фотошопе, если оттенки изменяемого цвета часто встречаются на снимке
Допустим, нужно изменить цвет губ модели. Красный, розовый и оттенки этих цветов присутствуют в цвете кожи. Меняя цвет губ, нужно оставить неизменным цвет кожи.
Открываем изображение в photoshop. Создаём корректирующий слой . Список корректирующих слоёв можно раскрыть на палитре слоёв внизу.
В окне настроек корректирующего слоя выбираем канал цвета «Красный», кликаем по инструменту «Пипетка»/Eyedropper Tool , затем делаем один клик на губах модели. Так мы определим цвет, который будем менять.
Внизу, на градиенте, появятся перемещаемые скобки. С их помощью можно сделать шире или уже диапазон заданного цвета. При перемещении чекера «Цветовой тон» /Hue выбранный оттенок губ будет меняться по всему спектру, в зависимости от того, куда вы отведёте чекер. При этом оттенок красного будет меняться на всём изображении.
Ctrl+I
Выбрав нужный для изменения цвет, закрываем окно редактирования корректирующего слоя, становимся на маску корректирующего слоя (белый квадрат) и нажимаем клавиши Ctrl+I . Маска инвертируется в чёрный, и все наши изменения зрительно пропадут.
Когда все участки, где цвет нужно было изменить, проработаны, можно сохранить изображение (сочетание клавиш Shift+Ctrl+S ). Если в каком-то участке вы промахнулись, можно отменить действие Alt+Ctrl+Z либо зарисовать на маске корректирующего слоя все промахи чёрной кистью. Этот способ более точно поможет подобрать новый цвет, и работа будет выглядеть аккуратнее.
Еще больше о Photoshop можно узнать на курсе в Fotoshkola.net.
Как заменить один цвет на другой в фотошопе, если исходный цвет чёрный или белый
Дела со сменой чёрного и белого цвета обстоят иначе.
Чтобы изменить чёрный цвет, можно применить корректирующий слой «Цветовой тон/Насыщенность»/Hue/Saturation , но работать при этом не с каналом цветов, а с тонированием. Для этого в настройке слоя нужно поставить галочку «Тонирование»/Colorize .
Рассмотрим подробнее. Допустим, нужно перекрасить чёрный диван. Выделяем диван с помощью инструмента (вызов клавишей W ).
С помощью комбинаций Ctrl+C и Ctrl+V переносим выделенную область на прозрачный слой и к нему применяем корректирующий слой «Цветовой тон/Насыщенность»/Hue/Saturation . Для этого между корректирующим слоем и слоем с выделенным объектом нужно щёлкнуть левой клавишей мыши, удерживая клавишу Alt .
Теперь двойным щелчком по корректирующему слою вызываем его настройки, ставим галочку «Тонирование»/Colorize и, перемещая чекеры цветового тона, насыщенности и яркости, подбираем нужный цвет.
Получается просто, красиво, без подвоха.
Для перекраски белого цвета можно воспользоваться корректирующим слоем «Цвет»/Color в режиме наложения «Умножение»/Multiply .
Открываем изображение, создаём корректирующий слой «Цвет»/Color . Цвет слоя сразу задаём тот, в который планируем покрасить белый.
Меняем режим наложения на «Умножение»/Multiply , становимся на маску корректирующего слоя и жмём Ctrl+I .
Переходим на слой с изображением и выделяем желаемые участки белого инструментом «Быстрое выделение»/Quick selection (вызов клавишей W ). Не снимая выделения, становимся на маску корректирующего слоя и белой кистью большого диаметра прокрашиваем маску. Цвет изменится лишь там, где вы задали выделение инструментом «Быстрое выделение»/Quick selection , которое можно определить по пунктиру.
При желании можно заменить цвет корректирующего слоя. Для этого щёлкаем по нему двойным щелчком мыши и выбираем в спектре любой новый цвет.
Вот так всё просто. Пробуйте, экспериментируйте. У вас обязательно получится. Теперь вам известно несколько способов того, как в фотошопе заменить цвет на другой.
Еще больше о Photoshop можно узнать на курсе в Fotoshkola.net.
В графическом редакторе Adobe Photoshop есть инструменты, с помощью которых можно определить цвет в какой-либо произвольной точке загруженного изображения. Результат измерения можно получить как в численном представлении, так и в виде эталонного цвет а для любого инструмента рисования. Предусмотрена и возможность обратной операции — зная числовое выражение цвет ового оттенка, вы можете задать его в качестве текущего рабочего цвет а.
Вам понадобится
- Графический редактор Adobe Photoshop.
Инструкция
Если нужно определить цвет в какой-то точке уже существующего изображения, начните с загрузки его в редактор. Для этого предназначен диалог, вызываемый сочетанием клавиш Ctrl + O — с его помощью вам надо найти в компьютере файл изображения, выделить его и нажать кнопку «Открыть».
При необходимости определить цвет в какой-то точке на экране монитора загрузите в Photoshop копию изображения с экрана. Сделать это очень легко — нажмите на клавиатуре Print Screen, переключитесь в окно графического редактора, нажмите Ctrl + N, затем Enter и Ctrl + V.
После того, как изображение открыто в Photoshop тем или иным способом, включите инструмент «Пипетка» — нажмите клавишу с английской литерой I. Можно сделать это и щелчком по соответствующей иконке на панели инструментов графического редактора.
Наведите указатель мыши на нужную точку картинки. Если требуется определить цвет какого-то мелкого элемента, увеличьте изображение — нажмите сочетание клавиш Ctrl и «Плюс» нужное число раз. Когда понадобиться вернуть нормальный размер, используйте сочетание Ctrl + Alt + 0.
Нажмите левую кнопку мыши — графический редактор определит оттенок в точке курсора и установит его в качестве рабочего цвет а. Если вам нужно получить результат в числовом представлении, откройте палитру цвет ов — кликните по иконке из двух пересекающихся квадратиков в нижней части панели инструментов. В открывшемся окошке выберите одно из численных представлений. Составные элементы разложения цвет а в кодировках RGB и CMYK помечены здесь соответствующими буквами, а шестнадцатеричный код помещен в поле у значка решетки # у нижнего края окна.
Если вам требуется произвести обратную операцию, т.е. установить рабочий цвет по известному числовому представлению, используйте эту же палитру. Составляющие кодировок RGB и CMYK придется набирать вручную, а шестнадцатеричный код можно скопировать в источнике и вставить в соответствующее поле палитры. Цвет будет установлен, когда вы нажмете кнопку OK.
Такой вопрос наверняка ни раз возникал у веб-дизайнера, разработчика или простого пользователя компьютера. Часто возникает необходимость подобрать цвет используемый на каком-либо объекте, например сайте или просто точки на экране монитора.
Существуют несколько основных способов представления цветов, например когда каждый цвет или оттенок, обозначается HTML кодом и цветовой палитрой RGB в виде #FF7700. Это представление в виде трёх пар шестнадцатеричных цифр, в которых каждая пара отвечает за свой цвет:
первые две цифры — красный цвет, т.е. — R (red)
две в середине — зелёный — G (green)
последние две цифры — синий — B (blue)
Довольно часто используют крадкое представление цвета в виде трех символов #F70, что будет равносильно #FF7700.
Кстати, на веб-ресурсах цвета обычно указываются в стилях CSS.
Давайте перейдем к ответу на главный вопрос — Как узнать цвет пикселя на экране монитора или картинке?
Способов большое множество…
Способ 1. Узнаем цвет в photoshop
Итак, сделаем «снимок экрана» нажатием на клавиатуре клавиши — Print Screen (PrtSc), в том месте, где хотим узнать код нашего цвета. Во время нажатия клавиши система сохранит снимок в буфере обмена. Можно просто скопировать изображение, например из браузера, без PrtSc. Теперь остается только вставить изображение из буфера в фотошоп.
Открываем фотошоп и вставляем изображение (Файл — Создать, Редактирование — Вставить). Ищем на панели инструментов «Пипетка» (Клавиша I), далее щелкаем левой кнопкой мыши в ту область, в котрой хотим «снять» цвет. Все готово! Теперь остается перейти в палитру и узнать код цвета.
Способ 2. Узнаем цвет в Paint
Заходим в Paint — вставляем картинку — используем инструмент «палитра» — переходим в «изменение цветов»:
В нашем случае красный — 252, зеленый — 168, синий — 10, т.е. RGB(252,168,10) или в HEX формате #FCA80A.
Способ 3. Просмотреть код элемента в браузере
Опишу способ для браузера Opera. Выделяем мышкой элемент на сайте и щелкаем по нему правой кнопкой мыши — «Просмотреть код элемента» (Ctrl + Shift + C). Откроется панель с html и css кодом, нужно будет найти что-то подобное «color».
Способ 4. Использование специальных средств или программ.
Существует большое количество специальных программ для снятия цвета, мне нравится очень простая прога под названием «Pixie» с весом около 10-11 Кб. Управление очень простое. Достаточно просто навести мышь в нужную точку на экране монитора и нажать следующие клавиши — Ctrl + Alt + C, в результате чего цветовой код скопируется в буфер обмена.
Понимание принципов формирования и баланса цветов способствует более эффективной работе в Photoshop. Владение базовой теорией цветов позволяет достигать последовательных результатов, не полагаясь на случай.
Первичные цвета
Первичные аддитивные цвета — это три цветовых компонента света (красный, зеленый и синий), которые в различных сочетаниях образуют все цвета видимого спектра. Сложение красного, синего и зеленого в равных долях дает белый цвет. Полное отсутствие трех первичных цветов дает черный цвет. Компьютерные мониторы — это устройства, которые формируют цветовое изображение на основе первичных аддитивных цветов.
A. Красный B. Зеленый C. Синий
Первичные субтрактивные цвета — это красители, которые, смешиваясь в различных комбинациях, образуют спектр цветов. В отличие от мониторов, принтеры используют первичные субтрактивные цвета (голубой, пурпурный, желтый и черный красители) для формирования цветов посредством субтрактивного смешивания. Термин «субтрактивный» используется потому, что после смешивания чистых первичных цветов формируются их менее чистые версии. Например, оранжевый цвет получается в результате субтрактивного смешивания пурпурного и желтого.
A. Голубой B. Пурпурный C. Желтый D. Черный
Если раньше вам не приходилось иметь дело с компонентами цвета, то для работы над цветобалансом полезно иметь под рукой стандартную диаграмму цветового круга. Она также позволяет предсказать, как изменение одного из компонентов цвета отразится на других цветах и каким образом эти изменения будут преобразованы между цветовыми моделями RGB и CMYK.
A. Красный B. Желтый C. Зеленый D. Голубой E. Синий F. Пурпурный
Например, интенсивность любого из цветов в изображении можно понизить, увеличив уровень противоположного ему цвета на цветовом круге, и наоборот. Цвета, лежащие в противоположных точках стандартного цветового круга, называются комплементарными . Аналогичным образом уровни цветов можно увеличивать и уменьшать, регулируя на цветовом круге два смежных цвета или даже два цвета, смежных с противоположным.
В режиме CMYK уровень пурпурного можно уменьшить двумя способами: либо снизив интенсивность пурпурного, либо повысив уровень его комплементарного цвета (находящегося в противоположной точке цветового круга), то есть зеленого. В режиме изображений RGB уровень пурпурного можно уменьшить, либо снизив интенсивность красного и синего, либо увеличив уровень зеленого. Все эти настройки влияют на общий цветобаланс, который будет содержать меньше пурпурного цвета.
Цветовые модели, пространства и режимы
Цветовая модель описывает цвета, которые мы видим и с которыми работаем в цифровых изображениях. Каждая из цветовых моделей (RGB, CMYK и HSB) использует для описания цветов собственный метод (обычно числовой).
Цветовое пространство является вариантом цветовой модели и характеризуется определенным охватом (диапазоном) цветов. Например, в цветовую модель RGB входят несколько цветовых пространств: Adobe RGB , sRGB, ProPhoto RGB и так далее.
Любое устройство, такое как монитор или принтер, имеет собственное цветовое пространство и способно воспроизводить цвета только в пределах его цветового охвата. При перемещении изображения с одного устройства на другое цвета изображения могут измениться, поскольку каждое устройство интерпретирует значения RGB или CMYK в соответствии с собственным цветовым пространством. Поэтому при перемещении изображений можно использовать управление цветом, чтобы большинство цветов оставались неизменными или выглядели почти одинаково. См. раздел Почему цвета иногда искажаются .
В Photoshop цветовой режим документа определяет, какая цветовая модель применяется при отображении и печати обрабатываемого изображения. Цветовые режимы Photoshop основаны на цветовых моделях, которые полезны при работе с изображениями, предназначенными для печати. Доступны следующие режимы: RGB (красный, зеленый, синий), CMYK (голубой, пурпурный, желтый, черный), Lab (основан на L* a* b* Международной светотехнической комиссии) и «Градации серого». Кроме того, Photoshop поддерживает режимы для специализированного отображения цветов (например, «Индексированные цвета» и «Дуплекс»). Цветовые режимы определяют количество цветов, число каналов и размер файла изображения. Выбор цветового режима также определяет, какие будут доступны инструменты и форматы файлов. См. раздел Цветовые режимы .
При работе с цветами изображения изменяются числовые значения, содержащиеся в файле. Однако слишком просто было бы представить цвета в виде чисел. Числовые значения сами по себе не являются абсолютными цветами — они всего лишь представляют цвета в цветовом пространстве устройства вывода.
В графическом редакторе Adobe Photoshop есть инструменты, с помощью которых можно определить цвет в какой-либо произвольной точке загруженного изображения. Результат измерения можно получить как в численном представлении, так и в виде эталонного цвета для любого инструмента рисования. Предусмотрена и возможность обратной операции — зная числовое выражение цветового оттенка, вы можете задать его в качестве текущего рабочего цвета.
Вам понадобится
- Графический редактор Adobe Photoshop.
Инструкция
Узнать код цвета (RGB, HEX)
Важную роль в том, насколько хорошо выглядит на экране монитора какой-либо графический объект и насколько он пригоден к использованию, играет цвет. Только представьте себе приложение или веб-сайт, которые вы используете или посещаете каждый день, если они будут выглядеть монохромными. Цвет помогает выделить различные элементы управления в пользовательском интерфейсе и его правильный выбор очень важен для веб-разработчиков. Как узнать код цвета, работая в операционной системе Windows 10 начинающему пользователю, не прибегая к использованию Photoshop или Illustrator, вы узнаете из этой статьи.
Если вы захотите узнать цветовой код графического элемента, не устанавливая в ОС дополнительное программное обеспечение, настоятельно рекомендуем использовать уже предустановленный в систему по умолчанию графический редактор Paint. Сделайте скриншот выбранного объекта на Рабочем столе, применив клавишу PrintScreen для снимка всего экрана, или добавьте в сочетание клавишу Alt для снимка активного окна. Это первый шаг.
Узнать код цвета
Запустите Paint и вставьте в рабочую область созданный скриншот. В разделе «Инструменты» выберите «Палитру» (значок с изображением пипетки). Нажмите на выбранный цвет, для которого хотите узнать код. Перейдите в окно «Изменение цветов», где и узнаете нужный RGB-код (красный, зеленый, синий).
Если вам нужен HEX-код (в виде #000000), а не RGB, то преобразуйте его в нужный формат, воспользовавшись инструментом «Дополнительный цвет» в разделе «Персонализация» системной утилиты «Параметры». Запустите её сочетанием клавиш Win+I на своей клавиатуре.
После нажатия на кнопку «Дополнительный цвет», вам откроется окно с цветовой палитрой. Внизу будет расположена кнопка «Больше», кликните по ней, чтобы расширить возможность выбора. Здесь сможете ввести RGB-код либо HSV, чтобы получить HEX-код и его предварительный просмотр. Это поистине замечательный и полезный системный инструмент.
Преобразование цвета в Google
Достаточно просто ввести код HEX в поисковую строку Google в своем веб-браузере. В результате поисковик представит вам его результат дополнительно в таких цветовых кодах:
Такие инструменты вряд ли станут частью вашего ежедневного арсенала приложений. Тем более не совсем подходят профессионалам в области дизайна. У них, вероятнее всего, уже есть свои наиболее предпочтительные. Предложенные нами способы узнать код цвета в большей степени ориентированы на людей, которым редко приходится редактировать графические объекты. Это работает быстро и исключает необходимость установки в систему дорогостоящего ПО. Спасибо за внимание!
Главная / Графика / Простой способ узнать код цвета (RGB, HEX) в Windows 10
Определение цвета пикселя. Пипетка программы Adobe Photoshop
При работе с изображениями часто требуется точно определить цвет пиксела. Это нужно для коррекции изображения или в дизайнерских работах для настройки цветовой гаммы фона, панелей или кнопок своей страницы в интернете или сайта.
Этот сервис позволит вам узнать цвет точки онлайн без скачивания и установки дополнительных программ. Работая в нашем сервисе онлайн пипетка, вы быстро и легко сможете узнать цвет любого фрагмента изображения.
Для этого необходимо загрузить картинку на сайт. Для загрузки файла, нажмите кнопку «Обзор». Выберите нужный файл с изображением и нажмите «Загрузить». Как только картинка загрузится, вы увидите её на экране. Затем нужно навести курсор на тот пиксель, цвет которого вы хотите определить. В отдельном окне вы сможете увидеть цвет пикселя, а в поле «Текущее значение» отобразится соответствующий номер пикселя в HTML и RGB цвета пикселя.
Сервис предусматривает сохранение кода цвета в формате HTML и RGB цвета. Для этого нужно навести курсор на нужный пиксель и щелкнуть левой кнопкой мыши. В поле «Сохраненные значения» в отдельном окне вы сможете увидеть цвет пикселя, а так же сохраненные значения кода пикселя в формате HTML и RGB цвета.
Отзывы
| Да вроде неплохо, спасибо |
| Норм |
| щедеврь |
| наес. |
| Помогли оч сильно лойс вам |
Такой вопрос наверняка ни раз возникал у веб-дизайнера, разработчика или простого пользователя компьютера. Часто возникает необходимость подобрать цвет используемый на каком-либо объекте, например сайте или просто точки на экране монитора.
Существуют несколько основных способов представления цветов, например когда каждый цвет или оттенок, обозначается HTML кодом и цветовой палитрой RGB в виде #FF7700. Это представление в виде трёх пар шестнадцатеричных цифр, в которых каждая пара отвечает за свой цвет:
первые две цифры — красный цвет, т.е. — R (red)
две в середине — зелёный — G (green)
последние две цифры — синий — B (blue)
Довольно часто используют крадкое представление цвета в виде трех символов #F70, что будет равносильно #FF7700.
Кстати, на веб-ресурсах цвета обычно указываются в стилях CSS.
Давайте перейдем к ответу на главный вопрос — Как узнать цвет пикселя на экране монитора или картинке?
Способов большое множество…
Способ 1. Узнаем цвет в photoshop
Итак, сделаем «снимок экрана» нажатием на клавиатуре клавиши — Print Screen (PrtSc), в том месте, где хотим узнать код нашего цвета. Во время нажатия клавиши система сохранит снимок в буфере обмена. Можно просто скопировать изображение, например из браузера, без PrtSc. Теперь остается только вставить изображение из буфера в фотошоп.
Открываем фотошоп и вставляем изображение (Файл — Создать, Редактирование — Вставить). Ищем на панели инструментов «Пипетка» (Клавиша I), далее щелкаем левой кнопкой мыши в ту область, в котрой хотим «снять» цвет. Все готово! Теперь остается перейти в палитру и узнать код цвета.
Способ 2. Узнаем цвет в Paint
Заходим в Paint — вставляем картинку — используем инструмент «палитра» — переходим в «изменение цветов»:
В нашем случае красный — 252, зеленый — 168, синий — 10, т.е. RGB(252,168,10) или в HEX формате #FCA80A.
Способ 3. Просмотреть код элемента в браузере
Опишу способ для браузера Opera. Выделяем мышкой элемент на сайте и щелкаем по нему правой кнопкой мыши — «Просмотреть код элемента» (Ctrl + Shift + C). Откроется панель с html и css кодом, нужно будет найти что-то подобное «color».
Способ 4. Использование специальных средств или программ.
Существует большое количество специальных программ для снятия цвета, мне нравится очень простая прога под названием «Pixie» с весом около 10-11 Кб. Управление очень простое. Достаточно просто навести мышь в нужную точку на экране монитора и нажать следующие клавиши — Ctrl + Alt + C, в результате чего цветовой код скопируется в буфер обмена.
Однажды человек научил компьютер определять цвет по коду. Все просто — код равен цвету и цвет равен коду. #FFFFFF = «белый», «черный» = #000000. И вот компьютер на мониторе отображает цвет и нужно узнать код цвета, чтобы использовать такой же цвет в другой программе. Как узнать код цвета? Для этого нужен «определитель цвета пикселей» или по-другому «программа пипетка». Программа ColorPic это мгновенный определитель кода цвета в любой точке экрана монитора. Утилита распознает цвет и показывает его кодовое обозначение в шестнадцатеричном и десятичном формате. Утилита ColorPic пригодиться и хорошо послужит дизайнеру и разработчику.
Определить цвет пикселя
Определяемые программой цвета можно хранить в отдельной палитре размером в 16 цветов для запоминания. Пользователь всегда может вернуться к составленной карте найденных цветов, палитра доступна и после перезапуска программы. ColorPic захватывает фрагмент экрана вокруг указателя мыши и отображает его увеличенное изображение в своем окне, при этом множитель масштабирования захваченной картинки можно изменять от 2 до 36. После запуска программа определяет цвет и его кодовое обозначение пикселя, находящегося под курсором мыши в любом месте экрана. Для добавления цвета в палитру в ColorPic реализована комбинация клавиш Ctrl+G.
Очень часто во время работы с сайтами и картинками требуется определить цвет какой-либо точки Вашего экрана монитора .
Например, Вы хотите сделать цвет фона на сайте точно таким же, как цвет голубого неба на фотографии. Или шрифт заголовков сделать такой, как цвет морской волны. Или наоборот, цвет шрифта использовать как фон для создания баннера. Словом, вариантов много. Тщательный подбор цветов очень много значит как в вебдизайне, так и в работе вебмастера.
Определение цвета означает нахождение его кода. Затем код, в зависимости от Ваших целей, можно использовать как в различных графических редакторах, так и непосредственно в коде html.
Чаще всего при этом используется , в котором код можно представить в десятичной и шестнадцатиричной системе.
Очень удобно для определения цвета использовать пипетку . Но, кроме этой программы, есть и другие, с помощью которых можно это делать.
Пипетка программы Adobe Photoshop
Думаю, немногие пользователи этой программы знают, что с помощью нее можно определить цвет не только любой точки на картинке, открытой в редакторе, но и любой точки на экране Вашего монитора.
Делается это очень просто. Открываете , создаете в ней изображение, и, не отпуская левую клавишу мыши, переводите курсор пипетки туда, где находится выбранная Вами точка. Это может быть любая точка за пределами окна программы. По мере движения курсора Вы будете видеть, как изменяется цвет рисования на палитре цветов. После выбора нужной точки отпускаете клавишу мыши. Кликаете по окошку цвета рисования на палитре цветов, и смотрите код Вашего цвета.
Такой способ определения цвета удобен тем, что не требует установки никаких дополнительных программ, кроме фотошопа, который у большинства пользователей и так уже установлен.
RGB цвет в HTML и Photoshop
Я работаю над простой целевой страницей. У меня есть 5 фоновых версий. Так просто, так плоско. Но вот в чем моя проблема. Я использую инструмент пипетки в Photoshop, чтобы найти, что такое код RGB фона. Но это не одно и то же. На моем компьютере я вижу идеальные цвета, но на других ноутбуках или мобильных телефонах это не очень хорошо. Я не знаю, что мне делать. Я сохранил bg JPG, PNG, но он все еще не работает. Не могли бы вы помочь мне найти решение ?
html css colors rgb photoshopПоделиться Источник pearcider 20 августа 2014 в 11:38
2 ответа
- Photoshop RGB уровней с ImageMagick
Я пытаюсь преобразовать некоторые эффекты, созданные в Photoshop, в код для использования с php/imagemagick. прямо сейчас меня особенно интересует, как воссоздать функцию Photoshop RGB levels. Я не очень хорошо знаком с интерфейсом Photoshop, но это та информация, которую мне дают: RGB Level…
- Цветовые различия между cocoa и photoshop
У меня возникли некоторые проблемы с цветами в interface builder и cocoa. Я строю свой интерфейс в photoshop, и когда я копирую значения RGB из photoshop и устанавливаю свои элементы UI в interface builder или через код, цвета даже не близки. Я возился с настройкой цветовых профилей в photoshop,…
0
Попробуйте сохранить изображение для web в Photoshop.
cmd + alt + shift + s
Поделиться Bokdem 20 августа 2014 в 11:47
0
Калибровка цвета отличается у разных устройств. Каждое устройство имеет свою собственную цветовую гамму. Однако он всегда будет отличаться. Люди будут калибровать их в соответствии со своими потребностями.
Поделиться Benjamin 20 августа 2014 в 11:48
Похожие вопросы:
RGB цвета Xcode отличаются от Photoshop RGB
Когда я использую 255 150 0 в Photoshop, оранжевый цвет отличается от оранжевого, который я получаю в Xcode, используя ползунки RGB. Кто-нибудь может мне помочь, почему это происходит?
Html получить цвет в Rgb
Ну, мне нужно сделать небольшой проект в webgl и нужно передать цвет от html к javascript, дело в том, что мне нужен этот цвет в Rgb, чтобы работать непосредственно с webGl, что мне нужно знать, так…
html цвета против цвет изображения
Есть ли возможность сделать цвета изображения точно такими же, как HTML цветов? У меня есть коробка с закругленными углами, углы-это изображения, а цвет фона-HTML, на моем ноутбуке это выглядит…
Photoshop RGB уровней с ImageMagick
Я пытаюсь преобразовать некоторые эффекты, созданные в Photoshop, в код для использования с php/imagemagick. прямо сейчас меня особенно интересует, как воссоздать функцию Photoshop RGB levels. Я не…
Цветовые различия между cocoa и photoshop
У меня возникли некоторые проблемы с цветами в interface builder и cocoa. Я строю свой интерфейс в photoshop, и когда я копирую значения RGB из photoshop и устанавливаю свои элементы UI в interface…
как получить значения rgb в процентах в photoshop
как получить RGB значений в процентах в photoshop. а разве процентные значения cmyk похожи на RGB?
Цвет шрифта в photoshop и css
http://i.stack.imgur.com/xmtfc.png Я установил тот же цвет в photoshop, а затем в css. В photoshop (слева) просто зеленый, а в css (справа) зеленый, синий, красный и т. д… Цвет такой же…
Xcode делает цвет на несколько оттенков темнее, несмотря на использование одного и того же RGB
Изображение слева происходит от Xcode, а изображение справа-от Photoshop. Оба цвета вводятся с использованием одного и того же значения RGB, но, как вы можете видеть, цвета отображаются по-разному….
Почему! 100% голубой в CMYK — это NOT rgb(0,255,255)? в Photoshop
Я пытаюсь преобразовать твердый голубой цвет в RGB в photoshop. Но я запутываюсь в значениях RGB rgb(0, 160, 233). Где я могу найти формулу или профиль icc для вычисления значений RGB, таких как…
неправильный цвет в палитре цветов photoshop
У меня очень странно в моем Adobe Photoshop на моем windows 10. Мой RGB цвет меняется на другой цвет, и я понятия не имею, почему это дерьмо происходит. Я переустановил приложение photoshop и все…
Как найти код hex по проценту цвета?
Например, как найти hex код 30% черный? Эквивалентно ли это #4d4d4d ?
Поделиться Источник user1448031 14 декабря 2014 в 12:10
2 ответа
- как найти код hex для более светлой или темной версии кода hex в php
Я пытаюсь добиться того, что делает этот парень , только в PHP или jQuery. в основном у меня есть цветовой код hex, скажем #FF0000,, который красный. Как бы я нашел более темные или светлые hex цветовых кодов этого цвета. Чтобы прояснить ситуацию: я хочу взять цветовой код hex (#FF0000) и найти…
- Получение значения цвета HEX код android
Эй, я следую за Android обучающей серией от thenewboston. Я по этой части: http: / / www.youtube.com / смотрю?функция=player_embedded&v=QjQg8NkHGbw Теперь я хочу сохранить некоторые основные цвета, такие как красный, зеленый и т. д. где-нибудь (в коде или в файле) и выделить им код HEX….
4
Ваш дизайнер дает вам цвета в CMYK, которые часто используются в печати.
CMYK означает Голубой Пурпурный желтый ключ (черный) и работает в процентах
Чтобы ответить на ваш конкретный вопрос, 30% черный-это #b3b3b3
Вы можете использовать этот инструмент, чтобы найти больше (или сделать это в Photoshop с помощью палитры цветов)
http://www.ginifab.com/feeds/pms/cmyk_to_rgb.php
Поделиться Dan Green-Leipciger 14 декабря 2014 в 13:10
1
0% черный-255,255,255. 100% черный-0,0,0. Таким образом, 30% черный должен быть 30% от 255 до 0, что равно 76.5. Если вы округлите, а затем преобразуете в hex, вы получите 4d, поэтому ответ будет «да».
Поделиться jaket 14 декабря 2014 в 12:17
Похожие вопросы:
Что такое код HEX для прозрачного цвета?
Я хочу установить цвет как прозрачный. В RGB 255 0 255 с Альфа-5 может работать как прозрачный, но как получить его в HEX ? Что такое код HEX для прозрачного цвета
Получить название цвета по HEX или RGB
Как я могу получить название цвета, используя JS/JQuery,, зная код RBG/HEX? Например: Colorname RGB black #000000 white #FFFFFF red #FF0000 green #008000
Получить более темный цвет hex код для данного цвета hex код
Как получить более темный цвет hex кода для данного цвета(представленного кодом hex). Например, для данного цвета #999999 я хочу получить более темный цвет hex, а именно он может быть #666666,,…
как найти код hex для более светлой или темной версии кода hex в php
Я пытаюсь добиться того, что делает этот парень , только в PHP или jQuery. в основном у меня есть цветовой код hex, скажем #FF0000,, который красный. Как бы я нашел более темные или светлые hex…
Получение значения цвета HEX код android
Эй, я следую за Android обучающей серией от thenewboston. Я по этой части: http: / / www.youtube.com / смотрю?функция=player_embedded&v=QjQg8NkHGbw Теперь я хочу сохранить некоторые основные…
gtk2hs-преобразование цвета в триплет hex
Я работаю в Haskell с gtk2hs и столкнулся с проблемой, на которую не могу найти ответа. Я пишу очень простую программу: она принимает значение цвета (или несколько значений цвета), а затем применяет…
Заказ цвета по значению Hex
Я не знаю, как классифицировать этот вопрос и объяснить его эффективно, но я сделаю все возможное. У меня есть серия случайных значений кода Hex, собранных из моего приложения. Я хочу представить…
Как я могу получить HEX или RGB цветовой код цвета фона окна?
Я хотел бы найти цвет фона окна в формате HEX. Ищу решение, которое работает на всех платформах… Windows/Linux/Mac… Следующий код print (self.cget(‘bg’)) просто печатает SystemButtonFace , но я…
Как я могу получить код hex, когда даю название цвета
Я делаю телеграмм-бота, и мне бы хотелось, чтобы он мог дать код hex против названия цвета. Я знаю, что существует чертовски много цветов rgb, но я также знаю, что есть статья Википедии с известными…
преобразование значения цвета материала в код Hex
Можно ли преобразовать значение цвета материала в код Hex в flutter, я уже некоторое время пытаюсь, но просто не могу обойти это. любая помощь будет оценена по достоинству.
Как использовать Photoshop для получения цветовых кодов из изображения • Лаура Сиболт
Если вы похожи на меня, вы проводите много времени на Pinterest в поисках вдохновения для дизайна, и очень часто я нахожу великолепные значки цветовой палитры. Или скажите, что вы просто просматриваете Интернет и наталкиваетесь на красивую фотографию.
В любом случае, вы вдохновлены и хотите получить цветовые коды этих цветов для использования в своих проектах. На самом деле это довольно просто сделать с помощью Photoshop, и я покажу вам, как именно.
Как определить веб-коды цветов из изображения в Photoshop.
Сначала найдите свою цветовую схему и щелкните ее правой кнопкой мыши, чтобы скопировать изображение.
(изображение выше взято из SwirledPeasDesigns на Etsy, с использованием краски Sherwin Williams Paint Colors)
После копирования зайдите в программу Photoshop и щелкните файл, затем новый. Выберите опцию буфера обмена и нажмите кнопку создания. После открытия страница будет пустой.
Просто нажмите кнопку управления и кнопку V, и ваше скопированное изображение будет вставлено прямо в документ.
Теперь вы хотите выбрать инструмент «Пипетка» в меню слева.
Щелкните свой первый цвет, здесь я выбрал серый. Вы можете видеть в меню образцов цвета в правом верхнем углу, что серый теперь является выбранным цветом.
Затем щелкните серое поле (следуйте за розовой стрелкой), и на экране появится меню цветов.
В меню цветов вы можете получить точный цветовой код для цвета, который вы ищете. числовое поле внизу.Код для этого серого цвета: # 999999
. У вас также есть возможность щелкнуть поле для цветов только для Интернета. Имейте в виду, что это изменит ваш цвет на ближайшую версию, но это может быть неточное совпадение. В зависимости от того, какие цвета вы используете для снятия флажка с поля «Только цвет в Интернете», это будет отличным вариантом для получения точного соответствия цветов.
Когда откроется меню цветовой рамки, вы можете просто щелкнуть следующий цвет и получить код из коробки. Код цвета морской волны # c9e7dd Код розового цвета — # ef6362, а код военно-морского флота — # 213556.
Теперь у вас есть свои цветовые коды.
Очень быстро и просто определить цветовые коды по изображениям, которые вы найдете в Интернете. Имейте в виду, что с плоскими цветами проще всего получить точный код.
Если вы пытаетесь взять цвет из одежды, пряжи или природы, вам, возможно, придется немного щелкнуть по изображению, чтобы получить точный цвет, который вы ищете, поскольку в таких предметах много различий.
А теперь иди и найди свое вдохновение!
Захват шестнадцатеричных кодов для цветов
Определение цветов в CSS — это все о шестнадцатеричных кодах.Вы знаете, эти буквенно-цифровые шестизначные числа вроде # 9 . Вы могли бы выучить несколько из них. Как тот, который я только что упомянул, красивый темно-красный. #cccccc — светло-серый цвет, все 0 — черный, все F — белые и т. д. Это полезно знать, но веб-страницы часто имеют все виды цветов, и вам понадобится способ получить шестнадцатеричные коды для цветов. ты хочешь. Но как? Ой, дай посчитать пути:
- Adobe Photoshop . Если у вас есть Photoshop, есть несколько уловок для получения шестнадцатеричных кодов.Самый простой — открыть изображение, из которого вы хотите получить цвет (часто это быстрый снимок экрана), выбрать инструмент «Пипетка», щелкнуть правой кнопкой мыши область, из которой вы хотите скопировать цвет, и выбрать « Копировать цвет как HTML». “. Более быстрый и сложный способ — это щелкнуть где-нибудь на открытом изображении, , удерживая нажатой, перетащить , а затем вы можете фактически взять образец цвета из в любом месте экрана . Чтобы получить шестнадцатеричный код, просто дважды щелкните цвет переднего плана и скопируйте его из палитры цветов.
- Назовите этот цвет . Это моя любимая онлайн-палитра цветов во всем мире =). Вы выбираете оттенок из круга вокруг внешней стороны, а затем оттенок / оттенок из квадрата в середине. Большая красивая полоса дает вам возможность хорошо рассмотреть свой цвет, и вы можете просто скопировать шестнадцатеричный код из поля ниже. Но лучшая часть заключается в том, что у него есть названия для всех цветов. # E5D79F такой безличный … назовем как есть, Зомби!
- Колорзилла .Еще один способ получить цвета Hex Code прямо из вашего браузера — использовать это отличное расширение Firefox. У вас — это , использующие Firefox, не так ли =). Просто щелкните маленькую пипетку на нижней панели и щелкните в любом месте окна браузера. Шестнадцатеричный код отображается прямо на нижней панели, или вы можете щелкнуть пипетку правой кнопкой мыши и скопировать цвет в различных форматах.
Photoshop RGB Color and Color Channels Tutorial
Автор Стив Паттерсон.
Знаете ли вы, что Photoshop дальтоник? Когда я говорю «дальтоник», я не имею в виду, что у него небольшие проблемы с различением определенных оттенков зеленого и фиолетового. Я имею в виду, что он полностью слеп, когда дело касается цвета. Photoshop видит только черно-белое изображение. Ну, черный, белый и много оттенков серого между ними, но это все. Самый мощный в мире редактор изображений, отраслевой стандарт среди фотографов, дизайнеров и практически всех творческих профессионалов, способный воспроизводить миллионы, даже миллиардов цветов, понятия не имеет, что такое цвет.
Возможно, вы смотрите на фотографию, сделанную вами в последний отпуск в кристально-голубых водах океана, но все, что видит Photoshop, — это серый океан. Удалось ли вам сфотографировать радугу, развевающуюся по небу после летнего вечернего шторма? Photoshop видит в этом прекрасный набор оттенков серого. И этот знаменитый горшок с золотом в конце? Для Photoshop это большой серый горшок.
Не жалейте Photoshop. Он совершенно счастлив в своем бесцветном мире.Фактически, единственная причина, по которой он вообще показывает нам наши изображения в цвете, заключается в том, что мы, люди, ожидаем увидеть их в цвете. Мы бы не знали, что и думать, если бы все было черно-белым. Но не фотошоп. Для него жизнь просто не могла быть слаще, чем в черном, белом и сером.
Загрузите это руководство в виде готового к печати PDF-файла!
Хорошо, если Photoshop не знает, что такое цвет, и все, что он знает и видит, это черный, белый и серый, как ему удается отображать наши изображения в цвете? Я имею в виду, вот изображение, которое я открыл в Photoshop:
Фотография, открытая в окне документа в Photoshop.
Очевидно, этот маленький парень (или девочка) цветной. На самом деле, я не думаю, что птицы бывают более красочными, чем это. Но дело не только в птице. Листья на заднем плане цветные. Деревянная доска, на которой стоит птица, цветная. Всё в цвете! И это изображение открыто в Photoshop, так как же может быть, что Photoshop не видит цвета? И если он действительно не видит цвета, как Photoshop так хорошо показывает нам то, чего он не видит?
Чтобы ответить на этот вопрос, нам нужно взглянуть на пару вещей.Один — это цветовых режима , а другой — цветовых канала . Оба они во многом связаны друг с другом, поэтому, как только вы поймете, первый из них, цветовые режимы, второй, цветовые каналы, приобретает гораздо больший смысл.
Мы знаем или, по крайней мере, на данный момент готовы согласиться с идеей, что Photoshop не видит цвета. Он видит только черное, белое и серое. Так как же он берет эти черные, белые и серые цвета и переводит их в цвета, которые мы видим на нашем экране? Ответ: это зависит от обстоятельств.Вы спросите, от чего зависит? Это зависит от того, какой цветовой режим использует Photoshop.
Существует довольно много разных цветовых режимов, но два основных — это RGB и CMYK . Несколько других, о которых вы, возможно, слышали во время работы в Photoshop, — это Grayscale и Lab (произносится «L-a-b», а не «Lab»). Все это примеры цветовых режимов, и они определяют, как Photoshop переводит свою черно-белую информацию в цвет, за исключением цветового режима «Оттенки серого», в котором цвет вообще не используется.Это строго черно-белый режим, который часто используется для быстрого преобразования цветного изображения в черно-белое.
Из этих четырех, о которых я упомянул, мы рассмотрим первую, RGB . Режим «CMYK» касается печати и чернил, и это отдельная тема на другой день. Как я уже упоминал, режим «Оттенки серого» широко используется для черно-белых изображений, а режим «Лаборатория» находится за пределами понимания большинства людей на планете, а также некоторых людей на других планетах, хотя часто бывает используется для профессионального редактирования изображений, но даже в этом случае большинство людей, использующих его, понятия не имеют, как это работает на самом деле.Остается «RGB».
Наиболее широко используемый цветовой режим в мире компьютеров и технологий — это цветовой режим «RGB». Photoshop использует его, другие программы на вашем компьютере используют его, монитор вашего компьютера использует его, так же как и ваша цифровая камера и сканер, ваш телевизор, даже маленький экран вашего мобильного телефона или iPod, а также эти портативные игровые системы, такие как Sony PSP или Nintendo DS. Если это устройство, которое отображает или захватывает изображения, или программа, которая редактирует эти изображения, например Photoshop, она использует цветовой режим «RGB».Звучит очень важно, не правда ли? И это, безусловно, так. Тем не менее, несмотря на широкое распространение и технологическое значение, все, что означает «RGB», — это названия трех цветов: Red , Green и Blue .
RGB и цветовые каналы: красочный мир красного, зеленого и синего
Так что же такого особенного в этих трех цветах: красном, зеленом и синем? Ну, это просто основные цвета света. И что это значит? Это означает, что каждый цвет, который мы с вами видим, состоит из некоторой комбинации красного, зеленого и синего.Как у нас желтеет? Смешивая красный и зеленый. Как получить пурпурный? Смешивая красный и синий. А как насчет апельсина? 100% красный, 50% зеленый. И это лишь основные примеры. Каждый видимый нами цвет состоит из комбинации этих трех цветов. Я знаю, звучит почти невозможно, но это правда.
Когда вы смешиваете полностью насыщенные версии всех трех цветов вместе, вы получаете чистый белый цвет. Когда вы полностью удалите все три цвета, вы получите чистый черный цвет. И когда вы смешиваете равное количество всех трех цветов с некоторым процентным соотношением от 0 до 100%, вы получаете оттенок серого.
Давайте еще раз посмотрим на нашу фотографию птицы:
Изображение действительно очень красочное, но откуда все эти цвета? Что ж, для начала давайте посмотрим, что сообщает нам информация в верхней части окна документа Photoshop:
Информация в верхней части окна документа.
Как я обвел красным, Photoshop сообщает нам, что это изображение использует цветовой режим «RGB», что означает, что каждый цвет, который мы видим на фотографии, состоит из некоторой комбинации красного, зеленого и синего. .Если нам нужны доказательства, все, что нам нужно сделать, это навести указатель мыши на любую часть изображения и посмотреть в палитре информации Photoshop .
Я собираюсь навести указатель мыши на конец его клюва, который представляет собой ярко-красную область:
Наведение мыши на конец клюва птицы.
Давайте посмотрим на палитру информации Photoshop, чтобы увидеть, что она говорит нам об этом месте на изображении:
Информационная палитра Photoshop.
Часть палитры информации, которая нас интересует, — это верхний левый угол, как я обвел выше, который показывает нам значения цвета RGB.Здесь вам нужно понять одну вещь, и это действительно отдельная тема, но Photoshop не перечисляет значения цвета RGB в процентах, поэтому мы не увидим таких значений, как «10% красного, 40% зеленого и 50. % синий». Вместо этого значения RGB перечислены в виде чисел от 0 до 255, где 0 — это полное отсутствие этого цвета в изображении, а 255 — это цвет с полной яркостью. Итак, если мы посмотрим на область, которую я обвел, мы увидим, что область, над которой я нахожусь на изображении, состоит из красного цвета со значением 216 (очень большое количество), зеленого со значением 59 (значение гораздо меньшее количество), а синий — всего 1 (с таким же успехом может быть равен нулю), что означает, что в этой области практически нет синего, а есть только небольшое количество зеленого.Подавляющее большинство цвета исходит от красного, что имеет смысл, поскольку клюв птицы явно красный.
Давайте посмотрим на другое место. Я наведу указатель мыши на область на его спине:
Наведение указателя мыши на место на спине птицы.
Мне эта область кажется довольно зеленой, и если мы посмотрим на то, что нам сообщает палитра информации:
Информационная палитра Photoshop показывает нам значения RGB для этой части изображения.
Конечно, преобладающим цветом является зеленый, его значение равно 180.Красный появляется только на 20, что очень мало, а синий еще меньше на 16.
Сделаем это еще раз. Наведу мышку где-нибудь над головой птицы:
Наведение указателя мыши на точку на голове птицы.
На этот раз синий цвет должен быть более заметным в палитре информации:
Информационная палитра Photoshop показывает нам информацию RGB для пятна на голове птицы.
И действительно, на этот раз синий цвет имеет значение 208 и является преобладающим цветом.Конечно, голова птицы не чисто-голубая. Он больше похож на пурпурно-синий, что объясняет, почему зеленый по-прежнему имеет значение 100, и даже красный цвет имеет приличный вид при значении 90. Все три смешиваются вместе на экране, чтобы дать нам тот пурпурно-синий цвет, который мы наблюдаем.
Я мог бы продолжить наведение указателя мыши на любое место на фотографии (я не буду, но могу), и мы увидим, что значения красного, зеленого и синего меняются в палитре информации, поскольку каждый цвет на изображении состоящий из некоторой их комбинации.
Вот как работает цветовой режим RGB. Опять же, RGB означает не что иное, как «красный», «зеленый» и «синий», и поскольку это изображение находится в цветовом режиме RGB, Photoshop воспроизводит каждый из цветов, используя комбинации красного, зеленого и синего.
Цветовые каналы
Итак, мы узнали, что Photoshop не видит цвета. Все в мире Photoshop состоит из черного, белого или какого-то оттенка серого. Мы также узнали, что Photoshop использует цветовой режим RGB для отображения цветов на экране путем смешивания различных комбинаций красного, зеленого и синего цветов.Но как Photoshop узнает, сколько красного, зеленого и синего нужно смешать для каждого цвета на экране, если он не видит цветов с самого начала? Я имею в виду, здорово, что Photoshop может отображать чистый желтый цвет, смешивая красный с полным значением силы 255 с зеленым также с 255, но как он вообще узнает, что желтый цвет отображается?
Ответ: нет.
А? Это не так?
Нет, это не так. Photoshop не знает, что вы ожидаете увидеть желтый цвет в определенной части изображения.Все, что он знает, это то, что он должен отображать красный цвет на 255 и зеленый на 255, а синий не включать. Если это дает определенный цвет, который мы с вами называем «желтым», — прекрасно, но на самом деле Photoshop все равно. Все, что он знает, это «отображать красный на 255, зеленый на 255 и синий на 0 в этом конкретном пикселе». Какой бы цвет ни был в итоге для вас и для меня, не имеет значения для Photoshop. При добавлении цветов к изображениям Photoshop строго «раскрашивает по номерам».
Хорошо, все, что знает Photoshop, — это добавить определенное количество красного, зеленого и синего цветов.Но как он узнает, сколько каждого цвета нужно добавить, если все, что он понимает, — это мир черного, белого и серого? Два слова … Цветовые каналы .
Давайте еще раз посмотрим на нашу фотографию птиц:
Вот как мы с вами видим изображение. Это , каким его видит Photoshop:
Но подождите, это еще не все. Это , тоже , как его видит Photoshop:
Но как это можно увидеть в двух разных черно-белых версиях? Хороший вопрос. Ответ: нет.Он видит его в трех разных черных и белых версиях. Вот и третий:
То, что мы видим как одно полноцветное изображение, Photoshop видит как три отдельных черно-белых изображения. Каждое из этих изображений представляет собой цветовой канал. Первый канал был красным, второй — зеленым, а третий — синим. Три отдельных канала для трех разных цветов, которые объединяются для создания полноцветного изображения.
Думайте о цветовых «каналах» как о цветных «фильтрах».Когда Photoshop отображает цветное изображение на экране, он знает, какие цвета отображать, светя через фильтры. Сначала он пропускает свет через красный фильтр (красный канал). Если через фильтр не проходит никакое количество света, Photoshop знает, что он отображает красный цвет со значением 0. Если весь свет проходит через фильтр, Photoshop отображает красный цвет с полным значением силы 255. Если через него проходит меньшее количество света. , Photoshop отображает красный цвет со значением где-то от 0 до 255 в зависимости от того, сколько света прошло.
Затем он делает то же самое с зеленым фильтром (зеленый канал), присваивая зеленому значение 0, если свет не проходит, 255, если проходит весь свет, и некоторое промежуточное значение, если некоторые, но не все источники света проходит через. Затем это делается с помощью синего фильтра (синий канал). Когда это будет сделано, он знает, какое значение установить для красного, зеленого и синего, и объединяет их, чтобы создать цвет, который мы видим. Он делает это для каждого пикселя в вашем изображении, поэтому, если ваше изображение содержит миллионы пикселей, как большинство фотографий с цифровых камер в наши дни, Photoshop проходит этот процесс миллионы раз только для того, чтобы отобразить изображение, которое вы видите на экране.Видите, как сильно вас любит Photoshop? Итак, минуту назад я сказал, что Фотошопу все равно. Давай просто пойдем дальше.
«Фильтры», которые использует Photoshop, — это те три отдельных черно-белых изображения, которые мы видели на предыдущей странице. Посмотрим еще раз на красный:
Черно-белое изображение с Красного канала.
Хорошо, так как же Photoshop удается использовать это черно-белое изображение в качестве красного фильтра? Помните, как я сказал, что Photoshop присваивает красному цвету значение от 0 до 255 в зависимости от того, сколько света проходит через фильтр? Ну, сколько света может пройти через фильтр, зависит от того, насколько яркой или темной будет эта часть черно-белого изображения.Любые области, которые являются чисто черными, не пропускают свет, что означает, что красный цвет будет установлен на 0 в этих частях изображения. Любые области, которые являются чисто белыми, пропускают полное количество света, поэтому для красного будет установлено значение 255 в этих областях. А области с некоторым оттенком серого, которые обычно составляют большую часть изображения, будут пропускать различное количество света в зависимости от того, насколько светлый или темный оттенок серого. На изображении выше мы видим, что самые яркие части изображения — это клюв и грудь птицы, что, исходя из того, что я только что сказал, должно означать, что эти области содержат много красного в полноцветной версии.Точно так же его спина, крыло и живот очень темные, поэтому на этих участках вообще не должно быть красного цвета, если таковые имеются.
Давайте еще раз посмотрим на полноцветную версию:
Мы сказали, что клюв и грудь должны содержать много красного, и, конечно же, они есть! Мы также сказали, что на спине, крыле и животе должно быть очень мало красного, если оно вообще есть, и они, конечно, не кажутся мне красными.
Давайте еще раз посмотрим на черно-белое изображение, которое Photoshop использует для зеленого канала:
Черно-белое изображение с Зеленого канала.
Это черно-белое изображение содержит много более светлых участков, что означает, что на этой фотографии должно быть много зеленого. Как ни странно, одна из самых ярких областей на изображении находится по бокам груди птицы, и я не помню, чтобы она была зеленой. Давайте проверим это, еще раз посмотрев на полноцветную версию:
На изображении определенно много зеленого, что объясняет, почему на черно-белом изображении было так много более светлых оттенков серого. Если я посмотрю на грудь птицы, которая была одной из самых светлых областей на черно-белом изображении, то она совсем не выглядит зеленой.На самом деле он очень желтый! Как такое возможно? Простой. Красный и зеленый вместе образуют желтый, поэтому, чтобы отобразить желтый, Photoshop должен смешать красный и зеленый вместе.
На этом изображении много очень темных участков, особенно на самой птице, за исключением очень яркой головы птицы. Это должно означать, что единственная часть птицы, которая должна казаться синей, — это ее голова, хотя ее живот также должен иметь заметное количество синего цвета, а также ноги и кусок дерева, на котором она стоит.Давайте посмотрим:
Конечно, голова птицы очень синяя, и мы также можем видеть синий цвет на ее животе, а также на лапах и дереве. На остальной части птицы нет заметных синих участков, поэтому на черно-белом изображении она выглядела такой темной.
И это почти завершает наш взгляд на то, как цветовой режим RGB и цветовые каналы работают в Photoshop, за исключением одного момента. Мы до сих пор не видели, где можно получить доступ к этим цветовым каналам. Вы найдете их в палитре каналов с соответствующим названием , которая сгруппирована с палитрой слоев:
Палитра каналов Photoshop.
Палитра «Каналы» очень похожа на палитру «Слои», за исключением того, что она показывает информацию о цветовом канале вместо слоев. Вы можете видеть, что есть один для красного, один для зеленого и один для синего, и каждый из них содержит свою отдельную черно-белую версию изображения, как я показал в этом уроке. Канал на самом верху, «RGB», на самом деле вообще не является каналом. Это просто комбинация всех трех каналов, дающая нам полноцветную фотографию. Вы можете щелкнуть любой из каналов по отдельности в палитре «Каналы», чтобы отобразить черно-белое изображение этого канала в окне документа.
И вот оно. Теперь мы знаем, что Photoshop видит все в черных, белых и серых тонах. Мы знаем, что он использует цветовой режим RGB (во всяком случае по умолчанию) для смешивания различного количества красного, зеленого и синего цветов для создания того, что мы видим как полноцветное изображение на нашем экране. И мы знаем, что он определяет, сколько красного, зеленого и синего использовать, глядя на черно-белую версию изображения в каждом из трех цветовых каналов, и что он делает это для каждого из миллионов пикселей в изображение, все для того, чтобы вы и я могли увидеть полноцветную версию, когда Photoshop был полностью доволен этим в черно-белом цвете.
И вот откуда мы знаем, что Photoshop нас любит. На этом мы закончим.
Как найти шестнадцатеричное значение любого цвета на экране
Узнайте, как за секунды выбрать любое значение цвета на экране. Особенно полезно для веб-дизайнеров!
Ваши цифровые устройства имеют миллионы привлекательных цветов. Любите какой-нибудь из этих цветов в особенности? Хотите использовать их в своем дизайне или для оформления своих приложений? Во-первых, вам нужно использовать утилиту выбора цвета, способную определять цветовой код на экране.
Существует множество бесплатных инструментов для пипетки, которые вы можете установить, чтобы скопировать цветовой код любого пикселя на экране всего за несколько кликов.
Instant Eyedropper — это приложение, которое определяет точное шестнадцатеричное значение цвета на экране. Затем вы увидите цветовой код пикселя, который находится прямо под указателем мыши. Отпустите кнопку мыши и вуаля! Шестнадцатеричный код этого цвета теперь находится в вашем буфере обмена, и вы можете вставить его куда угодно.
Хотите, чтобы цветовые коды были в другом формате? Перейдите к Options через контекстное меню Instant Eyedropper, чтобы указать свои предпочтения.
Скачать: Instant Eyedropper для Windows (бесплатно)
2. SIP (Mac)
SIP добавляет функцию выбора цвета в строку меню вашего Mac. Щелкните значок панели меню SIP, и вы найдете свою функцию пипетки в раскрывающемся списке.
Приложение поддерживает до 24 цветовых форматов, а также позволяет создавать палитры и делиться ими.
Загрузить: SIP для Mac (10 долларов в год, доступна бесплатная пробная версия)
3. Цифровой измеритель цвета (Mac)
Знаете ли вы, что на вашем Mac есть встроенная палитра цветов? Он называется Digital Color Meter — еще одно приложение, которое можно использовать для поиска цветовых кодов.Готовность к захвату экрана в любой момент, установка не требуется.
Вы найдете цифровой измеритель цвета в разделе Приложения> Утилиты . Это удобный инструмент для всех, кому нужно на лету получать цветовые коды элементов экрана.
По теме: обязательные расширения Chrome для веб-дизайнеров
4. ColorZilla (Chrome и Firefox)
ColorZilla — еще одно популярное расширение, используемое для получения шестнадцатеричных цветовых кодов экранных элементов.После установки щелкните значок на панели инструментов браузера, чтобы получить доступ к пипетке и другим функциям.
Наведите указатель мыши на любой пиксель; вы увидите как шестнадцатеричные значения, так и значения RGB. Щелкните пиксель, чтобы скопировать его шестнадцатеричное значение в буфер обмена. В настройках расширения вы также можете выбрать другой цветовой формат для использования с функцией автоматического копирования.
Скачать : ColorZilla для Chrome | Firefox (бесплатно)
Легко находите шестнадцатеричные цветовые коды на экране
Крошечные утилиты, такие как палитра цветов, могут показаться не слишком важными, но они пригодятся как дизайнерам, так и не дизайнерам.Мы настоятельно рекомендуем включить в свою жизнь одно или несколько.
Как использовать теорию цвета для совершенствования ваших творческих проектовПравильно используя правильные цвета, вы можете вывести свои творческие проекты на совершенно новый уровень.
Читать далее
Об авторе Акшата Шанбхаг (Опубликовано 404 статей)Акшата прошел обучение ручному тестированию, анимации и UX-дизайну, прежде чем сосредоточиться на технологиях и письме.Это объединило два ее любимых занятия — понимание систем и упрощение жаргона. В MakeUseOf Акшата пишет о том, как сделать все возможное из ваших устройств Apple.
Более Акшата ШанбхагПодпишитесь на нашу рассылку новостей
Подпишитесь на нашу рассылку, чтобы получать технические советы, обзоры, бесплатные электронные книги и эксклюзивные предложения!
Нажмите здесь, чтобы подписаться
снимков экрана Oregon — количество цветов и соответствие PMS
Преобразование цвета в PMS с помощью Illustrator
Нет Pantones? Не беспокойтесь, его легко преобразовать в ближайший Pantone .Имейте в виду, что ближайший к вам не всегда лучший вариант, поэтому лучше проконсультироваться с вашим клиентом, а также проверить соответствие Pantone Book .
Открыв векторный файл, нажмите Alt + 0 на ПК или ⌘ + 0 на Mac, чтобы переместить иллюстрацию на передний план и по центру.
Теперь, когда вы обнаружили, что вам не назначено цветов Pantone , вы можете легко преобразовать цвета в цвета Pantone всего за несколько шагов.
Нажмите Alt + A на ПК или ⌘ + A на Mac, чтобы выбрать все. Перейдите к Изменить Изменить цвета Перекрасить обложку …
Перейдите к Изменить Изменить цвета Перекрасить обложку …Это вызовет меню, в котором перечислены текущие цвета в файле. Внизу в центре вы увидите значок Book , который ограничивает выбор образцов библиотекой.Перейдите к Color Books PANTONE + Solid Coated
Перейдите к Color Books PANTONE + Solid CoatedЭто преобразует ваши цвета в Pantone + Solid Coated или Color Book , которые вы выберете. После этого, если вы посмотрите в свое верхнее правое окно на Color Window (F6) и Swatches , вы увидите Pantone Colors , которые были назначены. Всегда дважды проверьте номер в книге Pantone , чтобы убедиться, что это тот цвет, который вам нравится.
Всегда дважды проверьте номер в книге Pantone , чтобы убедиться, что это тот цвет, который вам нравится.Цвета назначаются на основе ближайшего Pantone , но ближайший может не всегда быть лучшим, поэтому всегда лучше спросить своего клиента, имеет ли он в виду Pantone .В этом случае Red 186 может быть лучшим вариантом, чем 1795 .
Как найти цветовые коды для вашей темы WordPress — Little Theme Shop
Все темы WordPress, которые мы продаем, имеют множество вариантов настройки цвета, так что вы можете адаптировать свой дизайн в соответствии с индивидуальностью вашего бренда. Однако, если вы новичок в дизайне и понятия не имеете, какие цвета у вашего бренда, все эти разговоры о «настройке цвета», вероятно, звучат немного ошеломляюще.Какой смысл в использовании десятков различных способов настройки цветов вашего сайта, если вы не знаете, какие цвета у вашего сайта или какими они должны быть?
Первым шагом к созданию цветов вашего бренда является изучение цветовых кодов HEX . Эти коды, которые представляют собой блоки букв и цифр с хэштегом перед ними (вы, вероятно, видели раньше #FFFFFF или # 000000 для белого и черного), очень важно иметь при настройке вашего сайта. Хотя настройщик WordPress имеет встроенный цветовой круг, выбрать из него «правильный» цвет непросто.На самом деле, некоторые из самых уродливых цветов, которые я когда-либо видел в своей жизни, возникли из-за этого ужасного цветового круга. Показательный пример:
Пропустите отбеливатель для глаз.Поверьте, если вы хотите, чтобы ваш сайт выглядел красиво, вам нужно использовать цветовые коды. Когда они у вас есть, все, что вам нужно сделать, это скопировать и вставить их в цветовое колесо, чтобы получить свой собственный цвет. И, к счастью, существует множество способов найти цветовую кодировку для своего сайта. Ниже я рекомендую несколько способов:
Используйте расширения браузера «палитра цветов»
Это мой личный выбор.Я использую расширение для Firefox под названием Colorzilla, которое, по сути, представляет собой инструмент для выбора цвета, который позволяет вам определять цвет любого объекта в вашем браузере. Просто щелкните значок Colorzilla в своем браузере и воспользуйтесь инструментом «Пипетка», чтобы получить цветовой код HEX из того, что вы щелкнули. Я использую его для и всего , тем более что я обычно слишком ленив, чтобы постоянно открывать Photoshop (это еще один, хотя и более продвинутый способ получения цветовых кодов HEX).
Как выглядит всплывающее окно Colorzilla после извлечения цвета.Так, например, если вы находитесь на чужом сайте и видите цвета, которые хотите для себя, вы можете использовать расширение палитры цветов для извлечения цветовых кодов с этого сайта.
Если вы используете Chrome, я рекомендую скачать расширение ColorPick. Если вы используете Safari или Edge, я не могу вам помочь (и втайне сужу вас).
Найдите цветовые схемы на Pinterest
Pinterest — это кладезь цветного вдохновения. (Фактически, у нас есть целая доска в Pinterest, посвященная этому.) Если вы ищете «цветовые палитры» или «цветовые схемы», вы должны получить массу цветовых идей, которые обычно включают в себя цветовой код HEX, напечатанный прямо под ним.
Найдя желаемую цветовую схему, просто введите цветовой код в настройщике WordPress. Однако, если вы очень ленивы, вы можете комбинировать это с расширением выбора цвета, чтобы сэкономить время.
Используйте онлайн-инструменты для извлечения кодов из изображений
Если у вас уже есть логотип с цветами, и вам просто нужно извлечь цветовые коды, используйте онлайн-инструменты, такие как ImageColorPicker.com или Image-Color.com, чтобы получить цветовые коды из изображения, не открывая Photoshop. Оба сайта позволяют загружать изображения и автоматически предоставляют все коды, которые программно находит на изображениях.
Это также хороший способ объединить цвета вашего бренда, если у вас их нет. Если вы стремитесь к определенной эстетике и у вас есть изображение, охватывающее все, что вы представляете себе, просто загрузите изображение в один из этих инструментов, чтобы найти нужные цвета.
Как видите, существует множество ресурсов для самостоятельного поиска профессиональных цветов. Не становитесь жертвой уродливого цветового круга WordPress. Найдите свои собственные цветовые коды и управляйте Интернетом.
Как управлять цветами в Photoshop
Управление цветом — огромная тема. Хотя это не то, что мы сможем полностью освоить за один присест, эта статья предоставит отличный обзор для пользователей, которые плохо знакомы с управлением цветом, с практическими советами по управлению цветами в Photoshop CC.
На этой странице мы покажем вам, как преобразовать ваши изображения из режима RGB в режим CMYK, и как это повлияет на цвета в вашем изображении. Перейдите на страницу 2, чтобы узнать, как настроить параметры цвета в соответствии с вашими потребностями.
Наконец, на странице 3 мы покажем вам, как синхронизировать ваш цветовой профиль во всех ваших приложениях Adobe CC, добавить определенный цветовой профиль, предоставляемый вашим принтером, и предварительно просмотреть CMYK-версию вашего дизайна без потери какой-либо информации RGB.
Чтобы применить свои новые навыки на практике, взгляните на наш список лучших руководств по Photoshop или сделайте свою настройку еще более индивидуальной с помощью плагинов Photoshop или кистей Photoshop.
Как преобразовать RGB в CMYK
Когда вы работаете с изображениями на наших компьютерах, вы смотрите на цветовое пространство RGB (красный, зеленый, синий). В RGB у вас есть доступ к гораздо большему количеству цветов, чем когда вы собираетесь выводить на печать. При печати изображений у вас есть доступ к голубому, пурпурному, желтому и черному (CMYK, где «K» означает «ключ»).
Когда вы начинаете с документа, находящегося в режиме RGB, и конвертируете его в CMYK, вы определенно потеряете некоторые цвета и часть яркости внутри этого изображения. Причина этого в том, что цветовое пространство RGB имеет намного больше цветов, чем CMYK. Один из способов избежать этого — использовать встроенную систему управления цветом Photoshop.
Давайте посмотрим, что происходит, когда вы конвертируете изображение RGB в CMYK для печати.
01. Найдите свой режим изображения
Переключиться с RGB на CMYK очень просто (щелкните значок в правом верхнем углу, чтобы увеличить изображение)Чтобы сбросить цветовой режим с RGB на CMYK в Photoshop, вам нужно перейти в Image > Режим.Здесь вы найдете свои варианты цвета, и вы можете просто выбрать CMYK.
02. Запишите свой цветовой профиль
Всплывающее окно с предупреждением Photoshop сообщит вам точный цветовой профиль CMYK, который он собирается использовать.Как только вы это сделаете, Photoshop выдаст вам предупреждение о том, что вы собираетесь преобразовать в CMYK с использованием определенного профиля, который будет указан в предупреждении. Предупреждение сообщает вам, что это может быть не то, что вы собираетесь делать, и даже показывает, куда вы можете перейти, чтобы выбрать правильный профиль.
03. Внедрить изменение
Изображение 1 из 2 Это в цветовом режиме RGB … Изображение 2 из 2 … и это в цветовом режиме CMYKПосле того, как вы нажмете OK, вы должны увидеть небольшой сдвиг в цвете. Теперь вы находитесь в цветовом пространстве CMYK. Удалось ли вам увидеть разницу в яркости и уменьшение цвета? Это может быть небольшое изменение, в зависимости от вашего монитора. Нажмите на значки со стрелками выше, чтобы сравнить два изображения.
Попробуйте это на нескольких разных изображениях, чтобы увидеть результаты, которые вы получите.Это позволит вам ознакомиться с изменениями. Одна вещь, которую нельзя избежать, — это смещение цвета при переходе от RGB к CMYK. В некоторых случаях изменения будут более драматичными, чем в других, так что будьте к этому готовы.
Следующая страница: Настройте и синхронизируйте настройки цвета
.