Бесплатно · без регистрации · HEX/RGB/HSL

Палитра цветов из фото

Загрузи фото — инструмент определит доминантные цвета с долей каждого. Клик по цвету копирует его в нужном формате, а всю палитру можно выгрузить в CSS-переменные, JSON или GIMP.

Загрузка инструмента...

Реальные цвета фото

Median-cut выделяет доминантные цвета, каждый из которых действительно есть на изображении.

Доля каждого цвета

Видно, что доминирует, а что акцент — не просто список цветов, а их вес на фото.

Копирование одним кликом

Клик по свотчу копирует цвет в HEX, RGB или HSL — переключай формат кнопками.

Экспорт в проект

CSS-переменные, JSON, GIMP .gpl — вставил и работаешь, без ручного переписывания.

От 2 до 16 цветов

Ползунок мгновенно перестраивает палитру под нужную детализацию.

Фото не сохраняются

Анализ в памяти сервера на время запроса — изображение нигде не хранится.

Как извлечь палитру из фото — 3 шага

1
Загрузи фото

Любой формат — JPG, PNG, HEIC. Палитра появится сразу после загрузки.

2
Настрой количество и формат

Ползунком выбери, сколько цветов извлечь (от 2 до 16), переключи формат HEX / RGB / HSL. Доля показывает, сколько каждого цвета на фото.

3
Скопируй или выгрузи

Клик по цвету копирует его в буфер. Всю палитру можно выгрузить кнопкой в CSS-переменные, JSON или файл GIMP .gpl.

Вопросы о палитре цветов

Да, полностью бесплатно и без регистрации. Загрузил фото — получил палитру, скопировал нужные цвета.

Инструмент анализирует все пиксели фото и группирует их в доминантные цвета методом медианного среза (median-cut) — тем же, что используют графические редакторы для построения палитр. Каждый цвет — реальный цвет с фото, а не усреднённая «каша». Рядом показывается доля: сколько процентов изображения занимает этот цвет.

HEX (#1e64dc), RGB (rgb(30, 100, 220)) и HSL (hsl(218, 76%, 49%)). Переключай формат кнопками — свотчи и экспорт сразу обновятся.

Да. Есть экспорт в CSS-переменные (:root { --color-1: … }), JSON (с hex/rgb/hsl и долями), файл GIMP .gpl (открывается в GIMP, Inkscape, Krita) и простой список. Кнопка экспорта сразу копирует результат в буфер обмена.

От 2 до 16. Для брендовой палитры обычно хватает 5–8 основных цветов, для детального анализа фото — больше. Ползунок перестраивает палитру мгновенно.

Это доля пикселей фото, попавших в этот цвет. Она показывает, какой цвет доминирует (фон, основной тон), а какой — акцент. Полезно, когда нужно понять не просто «какие цвета есть», а «какие главные».

Подобрать цвета для сайта или презентации под фотографию, вытащить палитру бренда с изображения логотипа, найти точный HEX цвета на скриншоте, собрать мудборд, подобрать сочетающиеся оттенки. Дизайнерам — быстрый способ получить рабочую палитру без Photoshop.

Нет. Анализ идёт в оперативной памяти сервера на время запроса, обратно возвращаются только цвета — само фото нигде не хранится.

Это только один из инструментов Gobanana

Под капотом — полноценный ИИ-редактор: нейрофотосессии, карточки для Wildberries и Ozon, замена фона, реставрация старых снимков — текстовой командой на русском, за 30 секунд.

Бесплатно · без установки · 3 генерации в подарок при регистрации

Зачем извлекать палитру из фото

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

  • Дизайн под фото. Сайт, презентация или пост, где фон/акценты должны перекликаться с ключевой фотографией.
  • Брендовая палитра. Вытащить точные цвета логотипа или фирменного изображения в HEX для гайдлайна.
  • Точный цвет на скриншоте. Узнать HEX конкретного оттенка, не открывая Photoshop и пипетку.
  • Мудборд и референсы. Собрать палитру вдохновляющего кадра и перенести в макет.

Чем эта палитра отличается

Многие экстракторы просто усредняют области и выдают цвета, которых на фото нет — грязноватые «средние» оттенки. Здесь каждый цвет палитры — реальный доминантный цвет изображения: алгоритм находит наиболее представленный оттенок в каждой группе пикселей, а не арифметическое среднее. Плюс рядом с каждым цветом — его доля, поэтому видно не только «какие цвета», но и «какие главные».

Форматы и экспорт

ФорматПримерГде пригодится
HEX#1e64dcCSS, HTML, дизайн-инструменты
RGBrgb(30, 100, 220)CSS, графические редакторы
HSLhsl(218, 76%, 49%)Когда нужно крутить оттенок/насыщенность
CSS-переменные:root { --color-1: #1e64dc; }Прямо в стили проекта
JSON[{ "hex": "#1e64dc", "share": 65 }]В код, дизайн-токены, автоматизацию
GIMP .gplпалитра-файлGIMP, Inkscape, Krita

Кнопка экспорта сразу копирует результат в буфер обмена — остаётся только вставить.

Сколько цветов брать

  • 5–6 цветов — классическая брендовая палитра: доминанта, вторичный, пара акцентов, нейтральный.
  • 8–10 цветов — детальнее, для сложных изображений с несколькими зонами.
  • 2–3 цвета — когда нужны только главные тона (например для дуотона или градиента).

Ползунок перестраивает палитру мгновенно — можно поиграть с детализацией и выбрать оптимальную.

Что дальше

  • Понравилась пара цветов — примени их как дуотон к другому фото в одноимённом инструменте.
  • Нужно подкрутить оттенок под палитру — используй RGB-цветокоррекцию.
  • Собираешь фавикон в фирменных цветах — залей нужный фон в генераторе favicon.