$ tools/image-color-picker

Пипетка цвета с изображения

Загрузите любое изображение и выберите точные цвета — hex, RGB, HSL и CMYK. Или автоматически извлеките доминирующую палитру. Клик для копирования, работает в браузере.

Перетащите изображение сюда
PNG, JPG, WebP или GIF — или вставьте из буфера (⌘/Ctrl+V)
100% локально · ничего не загружается
#000000
наведите на изображение…

$ Авто-палитра

цветов
Загрузите изображение, затем извлеките его доминирующие цвета.

# Выбранный цвет

Кликните где угодно на изображении, чтобы выбрать цвет.
HEXcopy
RGBcopy
HSLcopy
CMYKcopy

$ Сохранённая палитра

Выбранные цвета собираются здесь. Кликните образец, чтобы скопировать его HEX.

$ Как выбирать цвета из изображения

  1. Перетащите изображение в коробку выше, выберите файл или вставьте прямо из буфера. Всё происходит локально в браузере — изображение никогда никуда не загружается.
  2. Двигайте курсор над изображением. Лупа показывает пиксельный зум и live HEX-код, чтобы вы могли попасть в точное место.
  3. Кликните, чтобы выбрать. Цвет появляется справа как Hex, RGB, HSL и CMYK. Кликните любое значение, чтобы скопировать мгновенно.
  4. Продолжайте кликать, чтобы построить палитру. Сохранённые цвета собираются снизу — копируйте их все сразу или одним кликом возьмите один HEX.

Зачем брать цвета прямо из изображения?

Когда вы оформляете листинг приложения, Feature Graphic или иконку, ваши скриншоты уже несут цветовую историю. Сэмплирование реальных пикселей — синий вашего бренда, акцент в UI, точный тон фона — сохраняет всё согласованным вместо угадывания на глаз. Сопоставьте подписи, фоны и рамки ваших скриншотов с цветами, которые реально есть в продукте.

Hex, RGB, HSL или CMYK — что использовать?

Hex и RGB — для экранов: UI приложений, ассеты магазина, сайты. HSL дружелюбнее всего для подстройки — изменяйте светлоту или насыщенность без угадывания. CMYK важен только если что-то идёт в печать, например физическая промо-карта. Этот инструмент даёт все четыре для каждого пикселя, чтобы вам никогда не приходилось конвертировать вручную.

$ FAQ

Изображение загружается на сервер?

Нет. Пипетка читает пиксели прямо в браузере, используя canvas. Изображение не покидает устройство, что делает её быстрой и приватной.

Какие форматы изображений работают?

Всё, что может рендерить браузер — PNG, JPG, WebP, GIF, BMP и большинство других. Также можно вставить изображение из буфера с помощью ⌘/Ctrl+V.

Можно выбрать больше одного цвета?

Да. Каждый клик добавляет цвет в вашу сохранённую палитру внизу. Можно скопировать весь список HEX-кодов сразу, что удобно для переноса палитры в дизайн-файл.

Насколько точен выбранный цвет?

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

Работает на мобильных?

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

Изучите цвета глубже

Выбрали цвет, который вам нравится? Углубитесь в его оттенки, тени, гармонии, контраст и значение на наших страницах цветов.

Нравится LaunchShots?
Навсегда бесплатно — если сэкономил вам время, можете купить мне кофе.
Поддержать →
скопировано ✓