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

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

В этой связи мы хотим рассказать о 25 полезных инструментах для Windows, Mac, Firefox, Chrome, iPhone и Android.

Теперь вам не придется запоминать цвет: просто «хватайте» его и приступайте к работе!

Приложения для Windows

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

Простой в использовании инструмент, который прикрепляет к курсору экранную лупу. Воспользовавшись ею, вы можете увеличить определенный пиксель на экране. Eye Dropper 3.01 показывает RGB, CMYK и HEX значения цвета.

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

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

Quick HTML Color Picker – это бесплатный инструмент для получения цвета на любом экране с возможностью предварительного просмотра перед окончательным выбором. Цвет будет представлен в форматах RGB и HTML и скопирован в буфер обмена.

ColorPix выбирает цвета на вашем экране и показывает их в форматах RGB, HEX, HSB и CMYK. Здесь есть встроенная экранная лупа, позволяющая осуществлять более детальный и тщательный просмотр. Значения автоматически копируются в буфер обмена.

Just Color Picker – это не просто среднестатистический инструмент для «захвата» цвета, - показывает цвета в HTML, RGB, HSB/HSV и HSL форматах. Just Color Picker использует экранную лупу с тремя опциями, цветовые гаммы RGB и RYB для демонстрации триад и дополнительных цветов, поиск сочетающихся цветов, конверсии цветовых кодов и многое другое!

Это очень простой селектор цвета, представляющий цвета в форматах RGB, HEX, HTML и WinAPI. Вы можете скопировать один из них или все в буфер обмена. Инструмент можно минимизировать до панели оповещения.

Color Cop, возможно, и небольшой инструмент, но он может похвастаться богатством доступных опций. Вы можете использовать «пипетку» для того, чтобы «взять» цвет в любом месте экрана, и использовать экранную лупу для увеличения. Цвета доступны в таких форматах, как HTML hex, Delphi hex, Powerbuilder, Visual Basic, Clarion, Visual C++, RGB float и RGB int. Вы можете сохранить в истории до семи цветов, найти дополнительные и «безопасные» (web-safe) цвета, расположить приложение в области пиктограмм панели задач и многое другое.

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

Аддоны для Firefox

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

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

Rainbow Color Tools включает такие элементы, как распознаватель, который извлекает из текущей веб-страницы изображения и CSS; захватчик, который собирает цвета в RGB и HSV значениях; программа контроля, которая получает цвет любого пикселя в браузере; и, наконец, библиотека, которая сортирует сохраненные цвета по тэгам или url страницы, на котором был найден цвет.

Это один из наиболее продвинутых инструментов от Nvu для Firefox. Он достаточно незатейлив в использовании: вы просто кликаете и получаете цвет. Цвета представлены по названиям и в HEX формате. С помощью Rainbowpicker можно изменить оттенок, насыщенность и яркость, что, в свою очередь, позволяет создавать множество цветовых вариаций.

Приложения для Mac

Уникальность ColourMod состоит в том, что он доступен в пяти различных версиях: Konfabulator, ColorMod V1.9, ColourMod V2.2, Unbranded и Personalized. Каждая версия разработана таким образом, чтобы соответствовать вашим потребностям. Konfabulator – это версия для настольного компьютера, доступна для Mac и Windows. ColorMod V1.9 является виджетом для панели наблюдения Mac. ColourMod V2.2 – плагин для веб-приложений. Unbranded удаляет брендинг ColourMod, а Personalized позволяет добавлять в приложение свой собственный логотип.

DigitalColor Meter – инструмент для Mac OS X. Если вы проведете мышкой по экрану, он покажет цветовое значение любого пикселя. Вы можете задать формат, в котором будет показан цвет (RGB, YUV или CIE).

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

Hex Color Picker добавляет дополнительную вкладку в общесистемную цветовую панель, и вы сразу же можете видеть hex код любого цвета. Также у вас есть возможность изменять цвет, используя набор сокращений, и пользоваться опцией предварительного просмотра.

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

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

Расширения для Chrome

Применив colorPicker, вы можете «хватать» цвета с любой веб-страницы, сохранять и копировать их в буфер обмена. Цвета представлены в следующих значениях: HSB, RGB и CMYK. Веб-разработчики найдут здесь для себя много дополнительных функций, среди которых возможность проверить совместимость с WCAG 2, настройки в области «пипетки» и наличие DOM-Explorer для быстрого поиска элементов и тэгов на странице.

Данное расширение не только позволяет выбирать цвета на любой веб-странице, но и расположить на ней линейки, указатели и шкалу. Rulers, Guides, Eye Dropper & Color Picker располагает широким спектром опция для линеек, указателей и шкал, но селектор цвета и сам по себе работает отлично.

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

Color Pick представляет собой невероятно простой инструмент «пипетку» со встроенной экранной лупой. Расширение будет хранить заданный вами цвет до тех пор, пока вы не выберете новый. Цвета представлены в форматах RGB, HSL и HEX.

Приложения для iPhone

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

Этот селектор цвета хорошо подойдет для создания и последующей работы с палитрами на iPhone. Он конвертирует форматы в рамках RGB, HSB и CMYK. Вы можете брать цвета из своей фотокамеры, фото галереи или Flickr. Палитрами можно делиться посредством электронной почты, и, кроме того, они совместимы с Adobe Illustrator, Adobe Photoshop и Microsoft Word.

Приложения для Android

Этот функциональный инструмент для выбора цвета незаменим для дизайнеров, программистов и художников. Он поддерживает 7 различных режимов с цветовыми моделями RGB, HSV, HSL и YUV. Вы можете использовать как палитру, так и ползунок. Цвета представлены в decimal и HEX.

LifeDropper – приложение для Android, которое может назвать цвета реальных объектов, используя камеру на вашем устройстве. Цвета показаны в значениях RGB, CMYK и HEX.

На этом всё!

Какая из 25 представленных в нашей статье «пипеток» вам понравилась больше остальных? Возможно, вы пользуетесь инструментом, который не вошел в наш список? Если так, расскажите о нем нам!

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

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

Для этого необходимо загрузить картинку на сайт. Для загрузки файла, нажмите кнопку «Обзор». Выберите нужный файл с изображением и нажмите «Загрузить». Как только картинка загрузится, вы увидите её на экране. Затем нужно навести курсор на тот пиксель, цвет которого вы хотите определить. В отдельном окне вы сможете увидеть цвет пикселя, а в поле «Текущее значение» отобразится соответствующий номер пикселя в 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, в результате чего цветовой код скопируется в буфер обмена.

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

Выбор за sanstv.ru: найдет код пикселя

Отлично, наконец начали делать онлайн сервисы на русском sanstv.ru, и вот адрес , отличительная черта разбивает файл до пикселя. Чтобы начать пользоваться прошу смотреть скриншот.

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

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

1. Наводим на необходимое место на экране, большое увеличение.
2. Номер в двух формациях rgb и hex, оба используются, но популярнее hex.

Здесь много полезных вещей, например, как верстальщику соединение css. Создан альтруистом, за пользование денег не просит. Переходим к остальным сервисам.

Просто определить цвет онлайн с imagecolorpicker.com

Данный сайт imagecolorpicker.com отличается простотой определения цвета онлайн, работает быстро. Но простота дает некоторые ограничения:

• Нельзя увеличивать, если только нажатием cntrl и +.
• Чтобы определить оттенок нельзя пользоваться перетаскиванием и скринами, только загрузкой.

Сайт достоин внимания, пипетка выводится прицелом, не потеряйте.

Колорист imgonline.com.ua: поможет узнать даже цвет волос

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

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

Стоковый getcolor.ru: по картинке не работает

Поместил в статью getcolor.ru потому что нет претендентов, огромный минус: нет поиска по картинке. Работает на основе простого оттеночного круга, и выбора нажатием. Перемещаете бегунок в нужно направлении и смотрите параметры rgb, а так же hex.

Хотя нет, нашел один плюс, умеет давать название окраске, посмотрите внизу, каждый раз выдает разные. Использование: например в каталогах и при html верстке.

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

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

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

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

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

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

Пипетка программы Adobe Photoshop

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

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

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