Топ-40 программ для подбора цвета

Eye Dropper — расширение для идентификации цифрового колора

Возможно, еще кто-нибудь не знает, но расширения в браузере являются дополнительными инструментами. Они доступны в специальных магазинах. Так как Google Chrome является одним из популярных программ для серфинга в интернете, в его магазине больше всего таких мини-программ. Но нам не нужны все, а только Eye Dropper. Магазин Chrome находится на странице https://chrome.google.com/webstore/category/extensions?hl=ru. Чтобы найти расширение, выберите слева вверху строку поиска и введите в ней название.

Найдите расширение Eye Dropper в магазине Хром

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

Дальнейший порядок действий:

Откроется контекстное меню, где для выбора оттенка в браузере нужно нажать кнопку «Pick color from web-page»;
Указателем выберите нужный участок на экране, он тут же копируется. А цветовой квадратик возле пипетки примет оттенок, который вы выбрали;
Слева в информационном блоке расширения будут числовые значение в RGB, HSL, HTML и др. Чтобы удалить текущий колор, нажмите корзинку под кнопкой выбора;
Вы можете загрузить данные цвета в формате CSV, который можно открыть программой MS Excel.

При этом небольшое расширение Eye Dropper позволяет автоматически копировать данные выбранного цвета на мониторе. Есть настройка горячих клавиш для быстрого запуска в браузере, а также история всех выбранных раннее вариантов. Если вы пользуетесь браузером Google Chrome и вам часто необходимо определять цвета разных пикселей online, то это расширение несомненно для вас.

Способ 1: ImageColorPicker

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

Перейти к онлайн-сервису ImageColorPicker

На сайте нажмите кнопку «Use Your Image».
Выберите удобный вариант загрузки снимка. Вы можете вставить ссылку, сохраненный снимок в буфере обмена или сделать скриншот.
Для выбора картинки как файла кликните по выделенной области или сразу перетащите его туда.
В «Проводнике» отыщите снимок и дважды щелкните по нему левой кнопкой мыши.
Как видно, на экране отображается полное изображение, а под ним палитра используемых цветов, которые преобладают на холсте.
Водите курсором по картинке, выбирая подходящий пиксель для захвата.
После клика левой кнопкой мыши цвет фиксируется и отображается в блоке ниже.
Справа вы видите его значение в HEX и RGB. Скопируйте необходимые данные и используйте их в своих целях.

Как откалибровать монитор или матрицу ноутбука?

В принципе, правильные цвета можно «выжать» даже из мониторов на ТН-матрице, тут вопрос только в вашем терпении. Проблема таких матриц (которых большинство на рынке) в том, что в пересвеченных и затемненных участках они неправильно интерпретируют сигнал видеокарты и некорректно отображают цвет. Калибровка помогает справиться с этим и многими другими недостатками. Даже если вам повезло больше и у вас монитор на IPS, PVA, C-PVA или MVA-матрице, даже им калибровка тоже нужна, хотя и в меньшей мере. Правда, такие мониторы уже изначально неплохо откалиброваны, а в комплекте к ним идет специальное ПО, которое это позволяет сделать без особых трудозатрат.

Что такое программы-калибраторы?

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

С чего начать калибровку монитора?

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

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

Цвета ЖК-дисплея имеют свойство меняться при изменении угла зрения. У каких-то типов матриц это проявляется в большей мере, у каких-то в меньшей, но это характерно для всех. В особенности это касается вертикальных углов, у горизонтальных не так. Соответственно, нужно обеспечить стабильное положение глаз и такое же положение монитора по отношению к глазам (не забывайте про окружающий свет, если будете наклонять дисплей).

Приступаем к калибровке при помощи ПО

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

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

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

Каким ПО пользоваться?

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

Программа запускается из командной строки, но интерфейс у нее очень дружелюбный. Она идеально подойдет для начинающих пользователей, поскольку предлагает режим Wizard. Если есть желание повозиться подольше, и как следствие, получить более качественный результат, можно использовать более продвинутые программные комплексы вроде Eberhard Werle QuickGamma, TFT Test, PassMark Software MonitorTest и Atrise Software LUTCurve. Последняя признана лучшей программой такого рода, но нужно иметь хорошее представление о том, что вы хотите получить в итоге.

Смотрите видеообзор супердоступного игрового монитора AOC G2460PG

Горячие клавиши

Формат цвета

Ctrl+H — шестнадцатеричный код для HTML;
Ctrl+D — шестнадцатеричный код для Delphi;
Ctrl+B — шестнадцатеричный код для Visual Basic;
Ctrl+R — значения RGB;
Ctrl+K — значения CMYK;
Ctrl+P — значения для PhotoShop.

Усреднение (версия 5.0)

Ctrl+Alt+1 — точный цвет пикселя (без усреднения);
Ctrl+Alt+3 — усреднение 3×3 пикселя;
Ctrl+Alt+5 — усреднение 5×5 пикселей.

Zoom

Shift+F1 — zoom 1x;
Shift+F2 — zoom 2x;
Shift+F3 — zoom 3x;
Shift+F4 — zoom 4x;
Shift+F5 — zoom 5x;
Shift+F6 — zoom 6x;
Shift+F7 — zoom 7x;
Shift+F8 — zoom 8x;
Shift+F9 — zoom 9x;
Shift+F10 — zoom 10x;
Ctrl+Alt+Q — очистить область увеличения.

Координаты

Ctrl+Alt+C — задать нулевые координаты (0, 0) для текущего положения пипетки;
Ctrl+Alt+X — сбросить координаты (начало отсчёта — левый угол экрана).

Эти комбинации работают только при активной (нажатой) пипетке.

Sanstv.ru — простой и доступный инструмент для определения цвета пикселя

Многие дизайнеры, блогеры, художники знают, что веб-цвета имеют цифровое представление. Самой популярной моделью является RGB (красный, зеленый, синий). Эти три цвета при смешивании становятся основой для других оттенков. Поэкспериментировать с ними можно на сайте https://sanstv.ru/. На главной странице вы увидите разноцветный круг и выше параметры колора, представленные в модели RGB. Попробуйте сами передвигать ползунки каждого из трех цветов и увидите, как меняется расцветка пикселя в блоке выше.

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

Дальнейший порядок действий:

Вернитесь обратно на вкладку Sanstv.ru;
Нажмите уже в этом окне Ctrl+V;
Когда изображение вставится в рабочее окно, курсор мыши примет вид крестика, которым вы можете определить пиксель любой части скриншота. Для этого нужно просто нажать на него.

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

Цветопередача

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

Битые пиксели

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

битые пикселимертвые пиксели

Inettools — инструмент для копирования цвета

Есть еще несколько других инструментов в интернете. Возможно, они не такие удобные, как те, что были уже рассмотрены. Но некоторым они тоже могут понравится. Inettools — это еще одна онлайн-пипетка. Здесь вам также потребуется загрузить изображение, откуда нужно выбрать цвет цифровой картинки. Попадая на главную страницу https://ru.inettools.net, вы увидите рабочее окно. В него можно перетащить изображение. А можно загрузить его, нажав на кнопку под окном «Выбрать». После этого указать на своем компьютере путь к изображению.

Дальнейшие действия:

Когда картинка будет на рабочем столе Inettools, просто выберите курсором мыши любую точку на картинке;
Вся информация по выбранному пикселю отобразится в блоке ниже под названием «Сохраненное значение». Здесь представлен этот цвет в RGB и HTML, а также указано положение по горизонтали и вертикали;
В блоке «Текущее положение» отображается значение курсора, которым вы передвигаете в настоящее время.

С помощью такого нехитрого инструмента очень просто узнать любой цветовой пиксель на фотографии или цветной картинке. В нем можно выбирать несколько изображений и переключаться между ними. Их список находится под рабочим столом. Онлайн-инструментом подобного типа является https://imagecolorpicker.com/ru. В отличие от предыдущего сервиса, здесь есть возможно только загружать картинки из своего компьютера или по указанному URL.

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

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

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

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

Существуют несколько основных способов представления цветов, например когда каждый цвет или оттенок, обозначается HTML
кодом и цветовой палитрой RGB
в виде #FF7700. Это представление в виде трёх пар шестнадцатеричных цифр, в которых каждая пара отвечает за свой цвет:
первые две цифры — красный цвет, т.е. — R (red)

две в середине — зелёный — G (green)

последние две цифры — синий — B (blue)

Довольно часто используют крадкое представление цвета в виде трех символов #F70, что будет равносильно #FF7700.

Кстати, на веб-ресурсах цвета обычно указываются в стилях CSS.

Давайте перейдем к ответу на главный вопрос — Как узнать цвет пикселя на экране монитора или картинке?

Способов большое множество…

Как откалибровать экран

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

Способ 1. С помощью внешнего устройства

Этот способ подходит тем, кто профессионально занимается фотографией, производством видеороликов или дизайном в digital. Специальный девайс для калибровки экрана обойдётся в круглую сумму – в среднем от $150. Популярные модели, хорошо зарекомендовавшие себя в работе – X-Rite i1 Display Pro, Spyder Pro, Color Munki.

Работают они все по одному алгоритму:

Установите на компьютер специальное программное обеспечение (для каждого девайса есть своё приложение). Прогрейте монитор в течение 10-30 минут.
Подключите устройство к компьютеру, откройте крышку калибратора и повесьте на слегка наклонённый монитор. Он должен полностью прилегать к поверхности. С обратной стороны экрана должен располагаться противовес.
Оптимально будет перед началом работы сбросить настройки монитора к заводским. Дальше открываем утилиту для калибратора и ориентируемся по кнопкам в интерфейсе. Вот тут, например, есть видеоурок по калибровке монитора с помощью популярного девайса X-Rite i1Display Pro:

Способ 2. С помощью специальных программ и утилит

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

Atrise Software LUTCurve

Одна из лучших программ для ручной настройки цветопередачи. Главный минус – сложность: освоить её новичкам будет непросто.

Eberhard Werle QuickGamma

Простая программа с минимальным функционалом для настройки каналов RGB. Разобраться поможет вкладка “Помощь” в меню.

Бесплатная программа для калибровки с неплохим набором функций.

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

Fast Desktop Extender

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

Способ 3. Откорректировать системные настройки в компьютере

Это самый простой способ сделать базовую калибровку монитора. Настройка с помощью встроенного помощника – практически полностью автоматическая: нужно только нажать на пару кнопок, и система всё откалибрует сама.

Как откалибровать монитор на MacOS

Откройте Системные настройки и выберите Мониторы.
В открывшемся окне во вкладке Цвет кликните на кнопку Калибровать…
Нажмите Продолжить, чтобы начать калибровку.
Следуйте указаниям ассистента: сначала установите контрастность на максимум и настройте яркость монитора. Для этого используйте кнопки на передней панели устройства и натканное меню.
Выберите точку белого – она отвечает за цветовой оттенок вашего дисплея. Производитель рекомендует использовать стандартную точку.
В следующем окне можно поставить галочку, если вы хотите применить эти настройки по умолчанию для всех пользователей этого Mac.
Для некоторых мониторов также доступны настройки гаммы и светимости.

Как откалибровать монитор на Windows

В Windows проще всего найти нужный инструмент через строку поиска: введите “калибровка цветов” и щёлкните по найденной утилите.
Так же, как и в случае с Mac, программа предложит вам настроить всё пошагово. Сначала вы сможете настроить гамму:
Затем – настроить яркость с помощью картинки-примера:
Примерно так же настраивается контрастность:
Затем настройте цветовой баланс:
По окончании результат можно сохранить – для этого кликните по кнопке Загрузить текущие настройки. Новые настройки сохранятся в файле цветовой калибровки с расширением .ics.

4. Colorpicker

Вы художник или дизайнер Linux, предпочитающий терминал? В таком случае Color Picker может стать для вас инструментом определения цвета!

Color Picker — это простое терминальное приложение для определения цветов на экране и генерации HTML-кода.

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

Примечательные особенности:

Функция «одноразового использования» позволяет пользователям выбрать цвет, а затем сразу закрыть программу.Обнаружение цвета отображается как в HTML, так и в RGB по умолчанию, и пользователи могут отключить вывод RGB с помощью «короткой» функции.Функция предварительного просмотра Colorpicker позволяет пользователю предварительно просмотреть цвета, на которые наводит курсор мыши, не щелкая, чтобы предотвратить случайное нажатие.

Скачать — Colorpicker

Если вы хотите использовать приложение Colorpicker в Linux, вы можете скачать исходный код и скомпилировать его. Для пользователей Arch Linux также доступен пакет AUR.

Добро пожаловать

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

Тесты лучше всего рассматривать при тусклом или темном окружающем свете и в полноэкранном режиме.
При запуске тестов будет автоматически предложено перейти в полноэкранный режим.
При движении указателя мыши внизу экрана появится панель управления тестами.
С помощью элементов управления на панели вы сможете выбирать нужный вам тест, поворачивать слайд (если это предусмотрено тестом),
вернуться на главную страницу или выключить полноэкранный режим.
С левой и правой стороны экрана при движении мыши отображаются кнопки перехода между тестами.
Элементы управления для удобства исчезают с экрана при отсутствии движения указателя мыши.
Кроме того, предусмотрены горячие клавиши управления.
Для перехода между тестовыми экранами используйте клавиши «Влево», «Вправо» или «Пробел», либо колесико мыши.
Для поворота слайдов – «Вверх» и «Вниз», для выхода из теста — «Esc».

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

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

Способ 3: HTML Color Codes

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

Перейти к онлайн-сервису HTML Color Codes

Начните взаимодействие с загрузки файла, для чего нажмите «Upload File» или вставьте ссылку на изображение.
В случае с файлом отыщите его через окно «Проводника» и дважды щелкните по нему ЛКМ.
Используйте курсор и ЛКМ, чтобы выбрать подходящий фрагмент пикселей, который отобразится в первой плитке справа.
На ней вы можете указать конкретный пиксель, цвет которого желаете захватить. Он отобразится во второй плитке ниже.
Осталось только скопировать код HTML. В любой момент выберите другой фрагмент, чтобы получить соответствующий код и скопировать его точно таким же образом.

Способ 4: InetTools

InetTools — стандартный онлайн-сервис для определения цвета по фото. Предоставляет значение как в RGB, так и HEX, что позволяет использовать полученный оттенок практически для любых целей и даже отыскать его название по коду через любой другой сайт.

Перейти к онлайн-сервису InetTools

Перетащите картинку в выделенную на сайте область или нажмите по ней для выбора через «Проводник».

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

Если оно вас устраивает, сделайте клик ЛКМ для сохранения.

Обратите внимание на «Сохраненное значение», которое и удалось захватить. Скопируйте результат в RGB или HEX для дальнейшего применения.

Если хотите продолжить определение цвета по фотографии, прокрутите вкладку вниз и загрузите другое изображение.

Определение цвета в браузере Google Chrome

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

1.Точно так же щелкаем правой кнопкой мышки по интересующему нас элементу.
2.Выбираем пункт «Просмотреть код»
3.Далее, у нас открывается аналогичный инспектор. Единственное, у вас он может быть как в горизонтальном расположении, как у меня, так и в вертикальном, когда панель будет находиться справа.
4.Здесь мы находим панель отображения css-свойств, и нажимаем на значок одного из цветов.
= cvet6=
5.Далее, у нас открывается инструмент определения цвета, который, в принципе, похож на тот, который был в Mozilla Firefox. Единственное, что здесь еще можно задавать прозрачность цвета, выбирать цветовую гамму, и так же он может определять цвета не только в шестнадцатеричном формате, но и в формате RGB и RGBA.
6.Для точного определения цвета так же нажимаем на значок пипетки, наводим курсор на тот элемент, цвет которого мы хотим определить, и щелкаем левой кнопкой мыши.

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

Как и в Mozilla Firefox, после того как мы выбрали цвет в окне предпросмотра элемент подсветился таким же цветом, который мы выбрали. Однако при обновлении страницы все эти изменения исчезнут, и цвет станет таким же, как он задан в css изначально. То есть, для того, что бы эта кнопка стала такого же цвета, как и меню на сайте, мне нужно внести изменения в css-файл.

UltraMon

<�Рис. 3 UltraMon>

https://soft.mydiv.net/win/download-UltraMon.html

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

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

Преимущества такого софта в следующем:

Позитив:

«Заточенность» под мультимониторность;
Простое управление и понятный интерфейс;
Широкий функционал.

Негатив:

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

Способ 2: GetColor

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

Перейти к онлайн-сервису GetColor

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

Определение цвета при помощи специальной программы

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

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

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

После того, ка вы выбрали тот цвет, который вам нравится, вы нажимаете сочетание клавиш CTRL+ALT+C, и значение этого цвета попадает в буфер обмена.

Затем, это значение можно также задать в качестве цвета фона, но при этом обращаю ваше внимание, что оно копируется без знака решетки. Цвет определяется в шестнадцатеричном формате но знак решетки # вам нужно будет дописывать самостоятельно чтобы получилось примерно так: «#2F73B6»

Цвет определяется в шестнадцатеричном формате но знак решетки # вам нужно будет дописывать самостоятельно чтобы получилось примерно так: «#2F73B6».

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

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

1.Сначала нажимаем CTRL+ALT+C, что бы скопировать значение цвета.
2.Затем, на клавиатуре, нажимаем CTRL+ALT+X, после чего открывается вот такая палитра:
3.В этой палитре можно либо выбирать интересующие оттенки, либо при помощи ползунка справа делать цвет более темным или более светлым. При этом в окне предпросмотра отображается оттенок, который получается в результате этих манипуляций. Здесь значение цвета отображается как в формате RGB, так и в шестнадцатеричном формате.
4.Если значение скопированного цвета не вставилось автоматически, то нужно вставить его в поле «HTML», а уже потом делать его темнее или светлее при помощи ползунка справа.
5.После выбора нужного оттенка копируем шестнадцатеричное значение цвета из поля “HTML”

Для смены цвета фона при наведении нужно приписать к классу или идентификатору элемента псевдокласс hover, а заем задать цвет фона.

Получится примерно так:

CSS

.test-btn{
background:#2F73B6;
}
.test-btn:hover{
background:# 286199;
}

1
2
3
4
5
6
7

.test-btn{

background#2F73B6;

}

.test-btn:hover{

background#286199;

}

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