Дизайнеры периодически сталкиваются с проблемой как узнать точный цвет точки на экране мониторе, обычно таким грешат люди занимающиеся разработкой дизайнов сайтов, иногда проще скопировать цветовую гамму, чем самому изобретать велосипед. Можно пойти тернистым путем настоящих экспериментаторов, например делая скриншоты экранов потом разбираясь с полученными картинками в графическом редакторе или вообще роясь в исходных кодах веб страниц, но лучше не заниматься глупой работой изобретая очередной велосипед, а остановиться на утилите которая все сделает в долю секунды. Программ для этого предостаточно, сегодня пойдет речь о миниатюрной утилите .
Устанавливать программу не придется, единственный запускаемый файл это вся программа. Рекомендую поместить программу в отдельную папку, проще будет удалять, потому что после запуска создает файл настройки.
После запуска Colorpix представляет собой очень маленькое окошко, работающее по принципу, над 
какой точкой находиться курсор мыши, тот цвет и показываем. Можете поводить мышью и увидите бегущие цифры и буквы, показывающие координаты курсора, цвет в нескольких кодировках и квадрат, залитый выбранным цветом.
Нужный цвет запоминается нажатием любой клавиши, об этом свидетельствует появившийся замок, копируем значение, для дальнейшей работы нажимаем еще раз любую клавишу. Значения цвета не нужно переписывать вручную, вполне достаточно щелкнуть два раза мышью по нужной кодировке, и потом вставить.
Colorpix можно закрепить поверх всех окон, достаточно нажать плюсик сверху и вызвать что-то вроде увеличительного стекла, найдите и нажмите пунктик с хитрым названием «MAGNIFIER», после чего окно увеличиться в размерах и добавляется панель (иногда здорово помигает точно ткнуть в нужную точку).
Настроек как нет совсем, настолько утилита простая как двери.
Colorpix оказалась гениальной простотой, только необходимые возможности, минимальные размер и необычайно удобна в использовании. Как пользоваться, можно разобраться буквально за несколько секунд, все сделано максимально интуитивно. Если кому нужно быстро определить цвет любой точки на экране, рекомендую к использованию.
Станица для бесплатного скачивания Colorpix http://www.colorschemer.com/download.php
Последняя версия на момент написания Colorpix 1.2
Размер программы: файл 605 КБ
Совместимость: Windows Vista и 7, Windows Xp
Наверное, одна из первых утилит подобного плана, но, тем не менее, она не теряет своей популярности среди вэб-мастеров.
Программа показывает HTML код выбранного цвета и, наоборот, укажет цвет по коду.
Для определения цвета на мониторе кликаем по кнопочке Screen, наводим указатель в нужную точку, кликнем один раз по этому месту. В поле HTML Code выведется цвет в HTML Code. Осталось только скопировать этот код в буфер обмена и вставить в нужное место.
Преимущества: программа очень мало весит и крайне проста
Программа Color Picker
Преимуществом этой программы является показ цвета в RGB или HSL коде, ну и конечно, в HTML.
Для определения цвета надо кликнуть по кнопке "Select Color with Mouse", курсор мыши примет форму пипетки, остаётся навести курсор в нужное место и кликнуть по нему. Программа совместима с версиями Windows XP и выше.
Требует инсталляции на компьютер.
Программа Just Color Picker
Пожалуй, мне она нравится больше всего. Конкретно, мне очень помогает то, что после захвата цвета в интерфейсе появляется полоса с переменной тональностью и яркостью этого цвета. Т.е. я могу навести мышку на полосу и захватить ещё несколько близких цветов, например, незначительно ярче, для последующего выбора оптимального.
- При первом запуске предлагает выбрать язык, русский присутствует.
- В интерфейсе Just Color Picker есть экранная лупа.
- Позволяет сохранить несколько цветов.
- Снимает показание не кликом мышки, а горячими клавишами Alt+X(по умолчанию), что позволяет более точно определить цвет
- После определения цвета программа автоматически определит дополнительные цвета, которые будут гармонировать с выбранным и которые можно будет использовать в дизайне.
- Не требует установки, работает в фоном режиме.
Программа совместима с версиями Windows XP и выше.
Также нельзя не отметить бесплатную программу ColorPic 4.1 . Единственным её недостатком является то, что она требует инсталляции на компьютер, т.е. не может работать в фоновом режиме.
Но зато преимуществ у неё хоть отбавляй. Программа не совсем простая, поэтому описание и руководство по работе с ней приводится на этом сайте в отдельной статье
HTMLColors2000 это специальная программа для определения цвета, она поможет распознать любой цветовой оттенок, который увидит на экране вашего монитора. После того, как эта программа определит цвет, она представляет данные о нем в двух форматах RGB (красный зеленый голубой), и HTML (код состоящий из шести цифр).
Данная программа будет просто незаменима для веб дизайнеров, или для людей, которые любят рисовать в компьютерных программах. Почему незаменима? Потому что подобрать нужный оттенок очень сложно, порой даже невозможно. Есть конечно же и другие программы, которые умеют определять цвет, но перепробовав несколько программ, я остановил свой выбор именно на этой.
Вот мои аргументы в пользу этой программы:
1) Очень мало весит (всего 32 kb).
2) Не требуется инсталляция.
3) Потребляет мало системных ресурсов.
4) И самое главное, очень проста в использовании! Лично для меня в программе самое главное, это ее надежность, быстрота, и простота.
Работать с данной программой действительно очень просто:
2) Есть пять способов подбора цвета:
- Подбор цвета с помощью двигания ползунков RGB.
- Ручной ввод значений RGB.
- Выбор цвета из списка “Color Name”.
- Выбор из уже подобранных оттенков (боковая панель, открывается кнопкой “More”).
- Кнопка “Screen”, с ее помощью можно определить любой цвет находящийся на мониторе вашего компьютера.
Пятый способ самый замечательный! Про него я расскажу немножко по подробней.
После того, как вы нажмете на кнопку Screen, в левом верхнем углу вашего монитора появится небольшое окошко, на котором будут отображаться буквы и цифры, а также будет небольшая цветная полоска. Если вы подвигаете курсором то заметите, что буквы с цифрами начнут изменяться, а вместе с ними будет меняться и цветная полоска.
Эта цветная полоска отображает тот цвет, который находится под курсором вашей мыши, а буквы с цифрами это не что иное, как html код этого цвета.
Суть метода очень проста:
1) Вы нажимаете кнопку «Screen», и подводите курсор к тому цвету, код которого вы хотите получить.
2) Смотрите в левый верхний угол и убеждаетесь, что вы не промахнулись мима нужного вам цвета.
3) Когда курсор находится на нужной позиции, вы нажимаете левую кнопку мыши.
4) Теперь вам остается только забрать полученный код. Либо копируете html код, либо переписываете значение RGB.
Скачать программу для определения цвета:
P.S. Если программа не захочет устанавливаться на ваш компьютер (что весьма вероятно, если у вас установлена ОС Vista или Seven), вам поможет вот этот файлик.
Такой вопрос наверняка ни раз возникал у веб-дизайнера, разработчика или простого пользователя компьютера. Часто возникает необходимость подобрать цвет используемый на каком-либо объекте, например сайте или просто точки на экране монитора.
Существуют несколько основных способов представления цветов, например когда каждый цвет или оттенок, обозначается 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.
- Либо простым перетаскиванием с вашего компьютера в окно редактора.
- Может делать по фото в хорошем качестве.
- Удобно узнать окрас на сайте, сделал снимок и вставил.
После всех манипуляций увидите свою иллюстрацию и большое увеличение. Чтобы определить код (название) цвета надо навести на необходимый оттенок и посмотреть комбинацию.
- Наводим на необходимое место на экране, большое увеличение.
- Номер в двух формациях rgb и hex, оба используются, но популярнее hex.
Здесь много полезных вещей, например, как верстальщику соединение css. Создан альтруистом, за пользование денег не просит. Переходим к остальным сервисам.
Просто определить цвет онлайн с imagecolorpicker.com
Данный сайт imagecolorpicker.com отличается простотой определения цвета онлайн, работает быстро. Но простота дает некоторые ограничения:
- Нельзя увеличивать, если только нажатием cntrl и +.
- Чтобы определить оттенок нельзя пользоваться перетаскиванием и скринами, только загрузкой.
Сайт достоин внимания, пипетка выводится прицелом, не потеряйте.
Колорист imgonline.com.ua: поможет узнать даже цвет волос
Данный сайт не может указать именно какой нужен код, он делает разбивку на основные составляющие, вот адрес . Понадобиться дизайнеру, который не может установить популярный коллаж в иллюстрации. Отчет выглядит так:
Сначала прописываем количество основных оттенков (а именно пикселя на картинке которых больше будут упорядочены по убыванию). Выставляем сжатие, загружаем изображение, и ждем обработки. Так же может понадобится например парикмахерам, чтобы узнать цвет волос не тыкая, просто загрузить изображение прически и сервис разобьет на оттенок и название.
Стоковый getcolor.ru: по картинке не работает
Поместил в статью getcolor.ru
потому что нет претендентов, огромный минус: нет поиска по картинке. Работает на основе простого оттеночного круга, и выбора нажатием. Перемещаете бегунок в нужно направлении и смотрите параметры rgb, а так же hex.
Хотя нет, нашел один плюс, умеет давать название окраске, посмотрите внизу, каждый раз выдает разные. Использование: например в каталогах и при html верстке.
Рассказал про самые лучшие ресурсы, помогающие определить цвет онлайн без установки программ. Успехов.
Загрузка...
