Извлечь цвета из изображения

Находит цвета, которые использованы в изображении, и показывает их коды (HEX, RGB).

1. Выберите изображение

Подходят JPEG, PNG, WebP, GIF и HEIC (фото с iPhone).

Перетащите изображения сюда

или

2. Цвета изображения

Самые частые цвета изображения, начиная с самого частого. Нажмите, чтобы скопировать.

Количество цветов

Формат

3. Использовать все

Сохраните палитру картинкой или скопируйте все цвета сразу.

Всё происходит на этом устройстве. Изображения никуда не загружаются.

Цвета считаются по уменьшенной копии изображения, поэтому совсем мелкие детали могут не попасть в палитру. Для них используйте пипетку.

Пригодилось? Будем рады, если поделитесь

Что-то не работает или есть идея, как сделать лучше?

Сообщить о проблемеПредложить улучшение

Как пользоваться

  1. 1. Выберите изображение

    Нажмите «Выбрать файлы» и выберите фото или изображение.

  2. 2. Посмотрите, какие цвета использованы

    Под изображением появятся самые частые цвета. Измените «Количество цветов» или «Формат» и нажмите на цвет, чтобы скопировать его.

  3. 3. Возьмите цвет пипеткой

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

  4. 4. Используйте все сразу

    «Сохранить палитру картинкой» сохраняет изображение с цветами и их кодами.

Пригодится, когда

  • Хочется взять цвета с фото или иллюстрации

    Извлеките цвета из понравившегося фото или рисунка и используйте их в презентациях, документах или на сайте.

    Тем, кто занимается дизайном или документами

  • Нужно узнать точный цвет логотипа или товара

    Нажмите на изображение — и получите код цвета в этой точке. Удобно, чтобы проверить фирменные цвета.

    Веб-разработчикам и маркетологам

  • Нужно сразу перенести цвета в CSS

    Нажмите «Скопировать как CSS-переменные» и вставьте палитру прямо в таблицу стилей.

    Веб-разработчикам

  • Подобрать цвета для рукоделия или покраски

    Запишите цвета с фото в виде кодов — это поможет при выборе краски, пряжи или ткани.

    Тем, кто что-то делает своими руками

Что важно знать заранее

  • Цвета на экране выглядят по-разному в зависимости от монитора и яркости фото. Цвета для печати (CMYK) сверяйте по образцам типографии.
  • В сильно сжатых JPEG в однотонные на вид области примешиваются чуть другие цвета. Для точного цвета используйте пипетку.
  • Чтобы уменьшить вес изображений, попробуйте «Сжать изображения».

О кодах цвета

Код цвета описывает цвет числами. В вебе и программах для дизайна обычно используют три записи: HEX, RGB и HSL. Все они описывают один и тот же цвет, просто по-разному записанный.

Этот инструмент уменьшает изображение, объединяет похожие цвета и находит самые частые. Процент примерно показывает, какая часть изображения близка к этому цвету.

Способы записи цвета
ПримерГде обычно используют
HEX#F5A524Веб и программы для дизайна
RGBrgb(245, 165, 36)CSS и фоторедакторы
HSLhsl(37, 91%, 55%)Когда нужно менять яркость или насыщенность

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

Ответы на вопросы, которые часто возникают перед началом.

Мои изображения куда-то отправляются?

Нет. Всё происходит в браузере на вашем устройстве, изображения никогда не загружаются на сервер.

Цвета точные?

Цвет из пипетки — это точный цвет пикселя, на который вы нажали. Цвета палитры — это средние значения похожих цветов, поэтому они могут не совпадать ни с одним пикселем.

Нужного цвета нет в палитре.

Выберите 12 в «Количестве цветов», чтобы появились и редкие цвета. Для совсем мелких деталей нажмите на изображение и возьмите цвет пипеткой.

Как скопировать цвет?

Нажмите на цвет в палитре, и он скопируется. Цвета из пипетки копируются сразу при нажатии. «Скопировать все HEX» копирует все цвета разом.

Чем отличаются HEX, RGB и HSL?

Это разные способы записать один и тот же цвет. HEX использует «#» и шестнадцатеричные числа, RGB — доли красного, зелёного и синего, HSL — тон, насыщенность и светлоту. Переключайтесь на нужный.

Можно получить цвета для печати (CMYK)?

Нет. Инструмент показывает экранные цвета (sRGB). Для печати сверяйтесь с образцами цветов типографии.

Что с прозрачными областями?

При составлении палитры прозрачные области не учитываются.

Можно сохранить палитру?

«Сохранить палитру картинкой» сохраняет PNG с цветами и их кодами. «Скопировать как CSS-переменные» копирует их в виде, готовом для таблицы стилей.

Подходят ли фото с iPhone (HEIC)?

Да. Кроме JPEG, PNG, WebP и GIF, можно извлекать цвета из фото HEIC с iPhone.

Это бесплатно?

Да. Без регистрации и без рекламы.

Другие инструменты