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

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

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

Если вам нужно часто получать цветовые коды, наличие простого инструмента под рукой облегчит вашу жизнь. Instant Eyedropper на данный момент является бесплатным приложением исключительно для Windows.
После того, как вы установите его, вы сможете получить к нему доступ из системного трея. Просто нажмите и удерживайте левую кнопку мыши на выбранном вами цвете, а затем отпустите ее. Приложение мгновенно скопирует код цвета в буфер обмена, и вы сможете вставить его в любую программу. Мгновенная пипетка работает на Windows XP-10.
Цифровой измеритель цвета для Mac
Digital Color Meter — аналогичный инструмент, предварительно установленный на устройствах Mac. Откройте папку «Приложения» и найдите «Утилиты». Инструмент Digital Color Meter должен быть тут же.
Запустив это приложение, ваш курсор превратится в пипетку, с помощью которой вы сможете подобрать любой цвет с экрана. Приложение будет отображать значения RGB по умолчанию. Вы можете скопировать их и преобразовать в HEX позже или настроить параметры, чтобы получить точный цвет, который вы хотите.
SIP для Mac
Если вам нужен более продвинутый инструмент, вы можете изучить SIP, доступный для Mac. SIP — это больше, чем средство выбора цвета. Он также предлагает множество дополнительных функций, которые оценит любой веб-дизайнер. Вы можете легко редактировать свои цвета, организовывать их в палитры и изменять их форматы в соответствии с вашими потребностями.
К сожалению, SIP не является бесплатным инструментом, но они предлагают бесплатную пробную версию. Вы можете попробовать его, чтобы увидеть, стоят ли дополнительные функции ваших денег.
Преимущество этих настольных приложений в том, что они могут захватывать цвета практически из любой части экрана. Приведенные ниже инструменты браузера могут делать это только внутри веб-страниц. Конечно, вы можете обойти это ограничение, загрузив фотографию или скриншот для просмотра в браузере.
Используйте свой браузер
Следующий простой способ получить цвет кода RGB или HEX — просто использовать встроенные инструменты вашего браузера. Вы сможете выбирать цвета только с имеющейся веб-страницы, но для этого вы можете использовать как Firefox, так и Chrome.
Вот где можно найти инструмент выбора цвета Firefox:
- Запустите Firefox и откройте веб-сайт, на котором вы хотите извлечь цветовой код.

- Щелкните меню браузера (три горизонтальные линии) в правом верхнем углу.

- Найдите Инструменты веб-разработчика среди вариантов. Это может быть в разделе «Дополнительные инструменты».


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

Шаги аналогичны в Chrome:
- Запустите Chrome и откройте нужный веб-сайт.


- Нажмите меню (три вертикальные точки) в правом верхнем углу и найдите «Инструменты разработчика» в разделе «Дополнительные инструменты».

- В правой части страницы откроется окно. Найдите и нажмите «Стили» во втором разделе.

- Под «телом» вы увидите кучу цветных прямоугольников. Щелкните любой из них, чтобы активировать палитру цветов.

Совет. Вы также можете открыть инструменты разработчика в обоих браузерах, щелкнув правой кнопкой мыши любую страницу и выбрав «Проверить».
Используйте расширение для браузера
Помимо инструментов разработчика, вы также можете использовать удобные расширения для браузера, чтобы выбрать любой цвет на веб-странице. Проверьте следующие расширения, которые все делают свою работу:
Используйте веб-сайт
Вам не обязательно нужно приложение или расширение, чтобы определить код RGB или HEX для цвета. Если у вас есть определенное изображение, из которого вы хотите получить цвет, вы также можете использовать веб-сайт. Бесчисленные веб-сайты позволяют загрузить фотографию, извлечь цветовой код или даже создать гармоничную палитру.
PineTools Выбор цвета изображения

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

Веб -сайт Image Color Picker предлагает несколько других вариантов, помимо загрузки изображения. Нажмите «Использовать ваше изображение» и выберите, куда вы хотите импортировать изображение. Вы можете щелкнуть любую часть изображения, чтобы выбрать определенный цвет, но веб-сайт также предлагает цветовую палитру на основе изображения.
Поиск цвета изображения

Помимо простого средства выбора цвета, Image Color Finder также может выступать в качестве творческого инструмента. Вы можете сделать загруженное изображение пиксельным, чтобы лучше видеть его цвета, и увеличить его до нужного размера. Сайт также автоматически предлагает пару цветов.
Сделать снимок экрана
Наконец, вы можете определить код цвета без всех упомянутых выше инструментов. Вместо этого вы сделаете снимок экрана и выберете оттуда цвет.
- Убедитесь, что цвет, который вы хотите выбрать, виден на экране.
- Сделайте снимок экрана, нажав кнопку Print Screen на клавиатуре (PrntScr, PrtScn и т. д.) в Windows или одновременно нажав и удерживая «Shift + Command + 3» на Mac. Ваш скриншот будет автоматически скопирован в буфер обмена.

Совет: Вы также можете захватить только часть экрана. В Windows откройте Snipping Tool из меню «Пуск». На Mac используйте сочетание клавиш «Shift + Command + 4».
- Откройте MS Paint (или любое другое приложение для обработки изображений) и вставьте снимок экрана.
- Найдите инструмент «Пипетка» и выберите цвет.

- Нажмите «Редактировать цвета» рядом с цветовой палитрой в MS Paint. Под ползунком вы увидите значения RGB вашего текущего цвета.
Чтобы превратить эти числа в HEX-код, вам понадобится помощь веб-сайта.
- Перейдите к RGB to HEX и введите значения в соответствующие поля.

- Нажмите «Преобразовать в шестнадцатеричный», и вы получите свой код.

Дополнительные часто задаваемые вопросы
В чем разница между RGB и HEX? Какой мне нужен?
Коды RGB и HEX выражают одни и те же цвета. Тем не менее код, который вам понадобится, зависит от его предполагаемого использования. Коды RGB сообщают вашему экрану, сколько красного, зеленого и синего света нужно излучать для получения желаемого цвета. HEX-коды передают ту же информацию, но на языке кодирования.
Дизайнеру или разработчику, скорее всего, понадобятся HEX-коды цветов.
Как определить цвет на мобильном устройстве?
Чтобы выбрать цвет на экране вашего мобильного устройства, вы можете загрузить приложение или использовать один из веб-сайтов, упомянутых выше. В инструменте разметки также есть инструмент выбора цвета для iOS. Он также может дать вам HEX-код цвета.
Получите любой цвет, который вы видите, одним щелчком мыши
Использование цветовых кодов RGB или HEX гарантирует отсутствие вероятности ошибки. Благодаря этим универсальным цветовым языкам вы можете поддерживать соответствие своих дизайнов одним и тем же оттенкам. Поскольку существует много способов извлечь цветовой код на экране, вам просто нужно найти самый простой для вас способ.
Какой инструмент выбора цвета вы предпочитаете? Или у вас есть другой надежный метод для добавления? Дайте нам знать ниже.