Пиксель

Цвет по фото

Нажмите на снимок — получите точный HEX, RGB и HSL. Лупа помогает попасть в пиксель, палитра собирается сама.

Фото

JPG, PNG или WebP до 30 МБ. Нажмите на снимок — покажем точный цвет в этой точке.

Без галочки выбор файла недоступен: фото — персональные данные.

Как взять цвет

Наведите на фото, чтобы увеличить пиксели. Нажмите или проведите пальцем, чтобы взять цвет. С клавиатуры: стрелки двигают прицел, Enter берёт цвет.

Фото обрабатывается на устройстве и не отправляется на сервер.

Цвет

HEX, RGB и HSL выбранной точки. Палитра собирается по ходу работы.

Загрузите фото — и возьмите цвет в любой точке.

Полоса 1200×300 px с HEX-подписями — для сохранения или отправки.

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

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

Фото не отправляется на сервер: браузер читает файл локально и берёт цвет из canvas. Это важно для личных снимков, неопубликованных макетов и логотипов.

Точный пиксель HEX, RGB и HSL из выбранной точки без округления «на глаз».
Лупа Увеличение помогает попасть в мелкую деталь на телефоне.
Палитра До двенадцати цветов с копированием и экспортом PNG.
Локально Снимок обрабатывается на устройстве и не уходит в сеть.

Как это работает

  1. Поставьте галочку согласия и выберите JPG, PNG или WebP до 30 МБ.
  2. Наведите на фото, чтобы увеличить пиксели, и нажмите на нужную точку.
  3. Скопируйте HEX, RGB или HSL. Цвета собираются в палитру — её можно скачать PNG.

Где пригодится пипетка

  • Подобрать оттенок к фотографии или референсу
  • Вытащить цвет логотипа и фирменные цвета из снимка
  • Собрать палитру интерьера, одежды или товара
  • Проверить цвет на скриншоте интерфейса или макета
Генератор палитр Гармонии, палитра из фотографии и проверка контраста текста по WCAG. Проверка контраста WCAG AA и AAA для текста на фоне, подбор безопасной пары цветов. Генератор градиентов Линейные и радиальные градиенты, готовый CSS и PNG для соцсетей. Генератор QR-кодов Ссылка, Wi-Fi, визитка, Telegram или меню — в одном коде. PNG, SVG и PDF для печати.

Частые вопросы

Как взять цвет с фотографии?

Загрузите снимок, наведите курсор — над фото появится лупа с увеличением. Нажмите на точку, цвет которой нужен: она станет текущим цветом с кодом HEX, значениями RGB и HSL. На телефоне достаточно коснуться снимка и, не отпуская, сдвинуть палец до нужного места.

Насколько точен цвет?

Инструмент читает пиксель из копии изображения, нарисованной в canvas. Для снимков больше 2400 px по длинной стороне копия уменьшается, поэтому на границах объектов цвет может быть слегка усреднён. Для логотипов и скриншотов точность совпадает с исходником. Если нужен цвет из векторного файла, лучше открыть его при достаточном масштабе.

Зачем нужны HEX, RGB и HSL?

HEX удобен для CSS и графических редакторов, RGB — для экранов и canvas, HSL понятнее для подбора оттенков: тон, насыщенность и светлота. Все три значения показываются одновременно и копируются в буфер одним нажатием.

Фото загружается на сервер?

Нет. Браузер читает файл локально, рисует его в canvas и берёт цвет пикселя на устройстве. Снимок не отправляется на сервер, не сохраняется и не передаётся третьим лицам. Поэтому инструмент работает и без регистрации.

Можно ли взять цвет со скриншота?

Да, скриншот — обычный PNG или JPG. Загрузите его так же, как фото: удобно выбирать цвет интерфейса, элементы чужого сайта или оттенок из референса. Скриншоты обычно небольшие, поэтому точность будет пиксельной.

Что сохраняется в палитре?

Каждый выбранный цвет добавляется в палитру без повторов, последние двенадцать остаются. Нажмите на образец, чтобы скопировать его HEX, или скачайте полосу PNG 1200×300 px с подписями — удобно приложить к макету или отправить дизайнеру.