Піпетка кольору та витягання палітри із зображення

Витягніть палітру домінантних кольорів і загальний середній колір із будь-якого зображення прямо у браузері — кожен колір показано як копійоване HEX-значення.

Завантаження інструмента…

Піпетка кольору та витягання палітри із зображенняПеретягніть будь-яке зображення й миттєво отримайте його колірну палітру: найдомінантніші кольори плюс загальний середній колір, кожен зі зразком і кнопкою копіювання HEX одним кліком. Ви самі обираєте, скільки домінантних кольорів витягти (від 2 до 12). Зображення зчитується через HTML-канвас цілком у вашому браузері й ніколи не завантажується на сервер.

Що таке Піпетка кольору та витягання палітри із зображення?

Піпетка кольору зображення — це безкоштовний онлайн-інструмент для витягання палітри, який видобуває домінантні кольори та середній колір із будь-якого зображення прямо у браузері. Дизайнери, фронтенд-розробники й усі, хто створює бренд чи мудборд, можуть перетягнути фото, логотип або скріншот і за лічені секунди отримати HEX-палітру. Він зчитує пікселі зображення за допомогою getImageData у HTML-канваса, квантує їх у колірні кошики й упорядковує за тим, як часто трапляється кожен колір, тож найбільш використовувані кольори підіймаються вгору. Ви задаєте розмір палітри (скільки домінантних кольорів, від 2 до 12), і кожен колір показано як зразок із копійованим HEX-значенням поряд із загальним середнім кольором зображення.

Як користуватися Піпетка кольору та витягання палітри із зображення

  1. Перетягніть зображення в зону завантаження або клацніть по ній, щоб вибрати файл (PNG, JPEG, WebP чи будь-яке інше зображення, яке може відкрити ваш браузер) із вашого пристрою.
  2. Установіть у полі «Розмір палітри» потрібну кількість домінантних кольорів — від 2 до 12.
  3. Перегляньте рядок «Середній колір», щоб побачити єдиний змішаний середній колір усього зображення з його HEX-значенням.
  4. Перегляньте список «Домінантні кольори», упорядкований від найпоширенішого кольору донизу, кожен зі зразком та його HEX-значенням.
  5. Натисніть кнопку копіювання поряд із будь-яким кольором, щоб скопіювати це HEX-значення до буфера обміну.

Приклади

Витягти палітру бренду з логотипа

Перетягніть PNG із логотипом і задайте «Розмір палітри» рівним 4, щоб отримати чотири найбільш використовувані кольори у вигляді HEX-зразків, готових до вставлення у ваші дизайн-токени чи CSS-змінні.

Знайти відповідний тон фону за фотографією

Завантажте головне фото й перегляньте рядок «Середній колір», щоб отримати одне змішане HEX-значення, що гармоніює з усім зображенням — корисне як фон секції або запасний колір.

Зібрати більший набір зразків з ілюстрації

Перетягніть барвисту ілюстрацію й підніміть «Розмір палітри» до 12, щоб витягти широкий набір домінантних кольорів, упорядкованих за тим, яку частину зображення вони займають.

Поширені запитання

Які формати зображень можна використовувати?
Будь-яке зображення, яке може відкрити ваш браузер (зона завантаження приймає image/*), зокрема PNG, JPEG та WebP. Зображення малюється на HTML-канвасі, а його пікселі зчитуються локально для витягання кольорів.
Як обираються домінантні кольори?
Інструмент зчитує пікселі зображення, групує схожі кольори в кошики й упорядковує кошики за кількістю пікселів, що потрапили в кожен. Верхні кошики стають вашими домінантними кольорами, показаними від найпоширенішого, кожен — як середній колір свого кошика.
Скільки кольорів можна витягти?
Ви задаєте «Розмір палітри» від 2 до 12 домінантних кольорів. Загальний середній колір усього зображення завжди показано окремо, на додачу до цього списку.
Чому кольори можуть трохи відрізнятися від оригінального зображення?
Задля швидкості великі зображення зменшуються перед зчитуванням, а схожі кольори групуються, тож кожен зразок — це середнє значення групи, а не один точний піксель. Результат — достовірна репрезентативна палітра, а не попіксельна вибірка кольору.
Чи завантажується моє зображення кудись?
Ні. Зображення обробляється на 100% у вашому браузері за допомогою HTML-канваса. Воно ніколи не завантажується в deftdeck чи на будь-який сервер, тож інструмент працює офлайн і зберігає ваше зображення приватним.

Схожі інструменти