Иногда нужен не «примерно синий», а точный цвет.
Например, вы увидели красивый оттенок на баннере, хотите повторить цвет кнопки с сайта, подобрать фон для карточки товара или взять цвет из логотипа. На глаз это почти всегда лотерея: чуть светлее, чуть темнее, не тот тон.
Проще загрузить картинку в пипетку и кликнуть по нужному месту.
Для этого есть Пипетка цвета онлайн на Wertigo:
https://wertigo.ru/edit/image/color-picker
Что делает пипетка цвета
Вы загружаете изображение, нажимаете на нужный пиксель, а инструмент показывает точные значения цвета:
HEX - удобно для сайта и CSS
RGB - цвет в числах от 0 до 255
RGBA - если важна прозрачность
HSL - удобно менять оттенок, насыщенность и светлоту
Название цвета - чтобы проще объяснить оттенок словами
Координаты точки - если нужно запомнить место на изображении
Плюс инструмент показывает палитру заметных цветов из картинки. Это удобно, когда нужен не один пиксель, а общий набор оттенков для дизайна.
Когда это реально полезно
Пипетка цвета выручает не только дизайнеров.
Например, можно быстро:
- взять цвет кнопки со скриншота;
- узнать оттенок фона на баннере;
- подобрать цвет для презентации;
- собрать палитру из фото;
- передать разработчику точный HEX, а не «ну такой голубоватый»;
- проверить цвет логотипа или иконки.
Особенно удобно, когда картинка уже есть, а исходников в Figma или Photoshop нет.
Как определить цвет по картинке
Все просто:
- Откройте инструмент: https://wertigo.ru/edit/image/color-picker
- Загрузите JPG, PNG, WEBP или AVIF.
- Наведите курсор на нужный участок изображения.
- Кликните по пикселю.
- Скопируйте HEX, RGB, RGBA, HSL или название цвета.
Ничего устанавливать не нужно. Картинка открывается прямо в браузере, исходный файл не меняется.
Важный момент про фотографии
На фото один и тот же предмет может иметь десятки оттенков: свет, тень, блик, шум, сжатие. Поэтому не всегда стоит брать первый попавшийся пиксель.
Лучше кликнуть в несколько близких точек и выбрать оттенок, который выглядит стабильнее. Для логотипов, иконок и плоских картинок обычно проще: там цвет чаще ровный.
Какой формат копировать
Для сайта чаще всего берут HEX. Например, для CSS, кнопок, фона или текста.
Если цвет нужен в графическом редакторе, может быть удобнее RGB.
Если в PNG есть прозрачность, смотрите RGBA. Там кроме цвета есть еще альфа-канал, то есть уровень прозрачности.
А HSL полезен, когда нужно чуть поменять цвет: сделать светлее, насыщеннее или сдвинуть оттенок.
Коротко
Если нужно быстро узнать цвет по картинке, не обязательно открывать Photoshop или искать сложные программы. Загружаете изображение в пипетку, кликаете по нужному месту и копируете готовое значение.
Пипетка цвета онлайн на Wertigo:
https://wertigo.ru/edit/image/color-picker