# Піпетка кольору з фото

> Завантажте зображення, клацніть на колір і код HEX, RGB чи HSL скопіюється сам. Лупа, масштаб і палітра домінантних кольорів. Безкоштовно, без реєстрації.

URL: https://acrafto.com/uk/onlajn-pipetka-koloru/  
Updated: 2026-09-22

Tools are interactive browser apps; there is no public API, no endpoints to call and no server-side processing. To use a tool, open its HTML page in a browser.

Потрібно дізнатися, який колір на логотипі, фото чи скриншоті? Завантажте зображення, наведіть курсор на потрібне місце й клацніть. Код кольору одразу опиниться в буфері обміну у форматі, який ви оберете: **HEX, RGB, HSL, HSV або LCH**. Нічого встановлювати не потрібно, а зображення не покидає ваш комп’ютер.

## Як дізнатися колір із зображення

1. **Завантажте зображення.** Перетягніть його у вікно або натисніть «Огляд файлів». Піпетка підтримує JPG, PNG, WebP і GIF.
2. **Оберіть формат.** Над зображенням виберіть запис, у якому копіювати колір. Для вебу зазвичай підходить HEX, а для графічних програм RGB. Обраний варіант інструмент запам’ятає.
3. **Наведіть на колір.** Біля курсора з’явиться лупа зі збільшеними сусідніми пікселями, а під нею видно код кольору.
4. **Клацніть.** Код опиниться в буфері обміну, а колір збережеться на вкладці «Вибрані кольори». Просто вставте його там, де потрібно.

Хочете спробувати інше зображення? Перетягніть його прямо на поточне або видаліть іконкою кошика.

## Що вміє онлайн піпетка

### Лупа, яка показує кожен піксель

Звичайна піпетка показує лише колір під курсором, тож влучити в тонкий край літери стає справжньою лотереєю. Наша лупа збільшує область навколо курсора до 11 × 11 пікселів і обводить рамкою центральний. Ви бачите точно, куди клацнете, ще до кліку.

### Масштаб аж до окремого пікселя

Кнопками плюс і мінус або колесом миші з утриманою клавішею Ctrl можна наблизити зображення до 64 разів. З увімкненою сіткою видно межі пікселів, тож на іконках, пікс-арті чи дрібному тексті ви клацнете точно там, де потрібно.

### Колір з оригіналу, а не з мініатюри

Багато онлайн-інструментів спершу зменшують зображення й читають колір із прев’ю, де сусідні пікселі зливаються. Наша піпетка працює із зображенням у повній роздільності (до 4096 px на довшій стороні), тож ви отримуєте справжній колір пікселя.

### Копіювання одним кліком

Жодного виділення тексту чи переписування цифр. Кожен клік по зображенню копіює код в обраному форматі. Якщо той самий колір потрібен в іншому запису, деталі кольору показують усі п’ять форматів, кожен зі своєю кнопкою копіювання.

### Палітра домінантних кольорів

Одразу після завантаження інструмент знаходить до восьми кольорів, які переважають у зображенні, і показує їх на вкладці «Домінантні кольори». Майже однакові відтінки він об’єднує, тож у палітрі не буде п’яти варіантів сірого. Прозорі ділянки PNG пропускаються. Палітра стане основою кольорової схеми для сайту, презентації чи публікацій у соцмережах. Чи тримають кольори достатній контраст без відтінку, швидко перевірите [переведенням зображення у сірі відтінки](https://acrafto.com/uk/perevedennya-zobrazhen-u-vidtinky-siroho-onlayn/).

### Вибрані кольори завжди на видноті

Кожен колір, на який ви клацнете, зберігається на вкладці «Вибрані кольори» (останні 24). Так можна порівняти кілька місць на зображенні й будь-коли до них повернутися. На великому екрані панель кольорів розташована прямо біля зображення.

## Для чого потрібно дізнатися код кольору із зображення

- **Сайти й застосунки:** клієнт надіслав логотип лише як JPG, а вам потрібен точний фірмовий колір для CSS. Якщо ще й потрібна версія з прозорим фоном, скористайтеся [видаленням фону із зображення](https://acrafto.com/uk/vydalennya-fonu-z-zobrazhennya-za-dopomohoyu-shi/).
- **Графіка й соцмережі:** хочете, щоб текст на публікації пасував до фото. Візьміть колір прямо з нього.
- **Презентації та документи:** кольори фірмового логотипу налаштовуєте в PowerPoint, Google Slides чи Canva через HEX або RGB.
- **Перевірка макета:** на скриншоті перевірите, чи справді кнопка в застосунку має той колір, що передбачає дизайн. Розмір експортованих зображень заодно перевірите в [аналізаторі розмірів зображень](https://acrafto.com/uk/analizator-rozmiriv-zobrazhen-onlayn/).
- **Інтер’єр і мода:** маєте фото тканини чи стіни й шукаєте схожий відтінок. Код стане відправною точкою під час вибору у каталозі кольорів.

## Формати кольору, які повертає піпетка

- **HEX** (`#1373b6`): запис для HTML, CSS і більшості графічних інструментів.
- **RGB** (`rgb(19, 115, 182)`): частка червоного, зеленого й синього, кожна від 0 до 255. Як працює адитивне змішування кольорів, описує [Вікіпедія](https://uk.wikipedia.org/wiki/RGB).
- **HSL** (`hsl(205, 81%, 39%)`): відтінок, насиченість і світлість. З нього легко зробити світліший чи темніший варіант.
- **HSV**: відтінок, насиченість і яскравість, як ви їх знаєте з вибору кольору в Photoshop чи GIMP. Різницю між HSL і HSV детально пояснює [Вікіпедія](https://uk.wikipedia.org/wiki/HSL_%D1%96_HSV).
- **LCH**: модель, що відповідає тому, як колір сприймає людське око. Копіюється в запису, який розуміє сучасний CSS (див. [документацію MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Values/color_value/lch), англійською).

Піпетка визначає колір із зображення. Якщо хочете доопрацювати його, перевести в інші формати чи підібрати до нього суміжні відтінки, перейдіть до [колірного кола](https://acrafto.com/uk/kolir-picker-onlayn/).

## Часті запитання

### Чи завантажується моє зображення на сервер?

Ні. Зображення завантажується й обробляється прямо у вашому браузері, нікуди не надсилається, і після закриття сторінки від нього нічого не залишається. Тож піпетку спокійно можна використовувати і для внутрішніх матеріалів чи неопублікованих макетів.

### Як дізнатися HEX-код кольору з фото?

Завантажте фото, залиште над зображенням обраний формат HEX і клацніть на місці з потрібним кольором. Код, наприклад `#75dab2`, одразу опиниться в буфері обміну.

### Чому колір із фото відрізняється від реального?

Фотоапарат впливає на кольори через освітлення, [баланс білого](https://uk.wikipedia.org/wiki/%D0%91%D0%B0%D0%BB%D0%B0%D0%BD%D1%81_%D0%B1%D1%96%D0%BB%D0%BE%D0%B3%D0%BE_%D0%BA%D0%BE%D0%BB%D1%8C%D0%BE%D1%80%D1%83) й стиснення. Піпетка повертає точно той колір, що збережений у файлі. Для фото клацніть на кількох місцях і порівняйте їх на вкладці «Вибрані кольори». Якщо за кодом змішуєте фарбу для стіни, сприймайте його як орієнтир.

### Чи працює піпетка на мобільному?

Так. На сенсорному екрані торкніться місця на зображенні, і код скопіюється так само, як на комп'ютері. Лупа біля курсора на мобільному не показується, тож для дрібних деталей спершу наблизьте зображення.

### Яка різниця між HEX і RGB?

Обидва записи описують той самий колір. RGB виражає його трьома числами від 0 до 255, HEX записує ті самі числа в шістнадцятковій системі за знаком #. Наприклад, `rgb(255, 87, 51)` це те саме, що й `#ff5733`.

### Як отримати з зображення цілу кольорову палітру?

Відкрийте вкладку «Домінантні кольори». Там знайдете до восьми головних кольорів зображення, і клацання на будь-якому з них скопіює його код.

## Other languages

- Čeština (cs): [Online kapátko](https://acrafto.com/cs/vyber-barev-z-obrazku/) ([Markdown](https://acrafto.com/cs/vyber-barev-z-obrazku/index.md))
- Slovenčina (sk): [Online kvapátko](https://acrafto.com/sk/online-kvapatko-vyber-farieb-z-obrazku/) ([Markdown](https://acrafto.com/sk/online-kvapatko-vyber-farieb-z-obrazku/index.md))
- English (en): [Image Color Picker](https://acrafto.com/en/online-image-color-picker/) ([Markdown](https://acrafto.com/en/online-image-color-picker/index.md))
- Deutsch (de): [Farbe aus Bild bestimmen](https://acrafto.com/de/farbauswahl-bild-online/) ([Markdown](https://acrafto.com/de/farbauswahl-bild-online/index.md))
- Français (fr): [Pipette à couleurs](https://acrafto.com/fr/pipette-couleur-image-en-ligne/) ([Markdown](https://acrafto.com/fr/pipette-couleur-image-en-ligne/index.md))
- Español (es): [Cuentagotas de imagen online](https://acrafto.com/es/selector-colores-imagen-online/) ([Markdown](https://acrafto.com/es/selector-colores-imagen-online/index.md))
- Italiano (it): [Contagocce colore](https://acrafto.com/it/selettore-colori-online-da-immagine/) ([Markdown](https://acrafto.com/it/selettore-colori-online-da-immagine/index.md))
- Português (pt): [Conta-gotas online](https://acrafto.com/pt/extrator-cores-imagem-online/) ([Markdown](https://acrafto.com/pt/extrator-cores-imagem-online/index.md))
- Nederlands (nl): [Kleur uit afbeelding halen](https://acrafto.com/nl/online-kleurenpipet/) ([Markdown](https://acrafto.com/nl/online-kleurenpipet/index.md))
- Polski (pl): [Kroplomierz kolorów z obrazu](https://acrafto.com/pl/kroplomierz-online-kolory-z-obrazu/) ([Markdown](https://acrafto.com/pl/kroplomierz-online-kolory-z-obrazu/index.md))
- Română (ro): [Pipetă de culori din imagine](https://acrafto.com/ro/selector-culori-imagine-online/) ([Markdown](https://acrafto.com/ro/selector-culori-imagine-online/index.md))
- Magyar (hu): [Színpipetta](https://acrafto.com/hu/kep-szinkivalaszto/) ([Markdown](https://acrafto.com/hu/kep-szinkivalaszto/index.md))
- Ελληνικά (el): [Σταγονόμετρο εικόνας](https://acrafto.com/el/image-color-picker/) ([Markdown](https://acrafto.com/el/image-color-picker/index.md))
- Български (bg): [Онлайн пипетка за цвят от снимка](https://acrafto.com/bg/image-color-picker/) ([Markdown](https://acrafto.com/bg/image-color-picker/index.md))
- Hrvatski (hr): [Pipeta za boje](https://acrafto.com/hr/alat-za-odabir-boja-slike/) ([Markdown](https://acrafto.com/hr/alat-za-odabir-boja-slike/index.md))
- Slovenščina (sl): [Barvna kapalka za slike](https://acrafto.com/sl/spletni-izbirnik-barv-iz-slike/) ([Markdown](https://acrafto.com/sl/spletni-izbirnik-barv-iz-slike/index.md))
- Eesti (et): [Pildi värvipipett](https://acrafto.com/et/pildi-varvivalija/) ([Markdown](https://acrafto.com/et/pildi-varvivalija/index.md))
- Latviešu (lv): [Krāsu pipete](https://acrafto.com/lv/krasu-pipete-online/) ([Markdown](https://acrafto.com/lv/krasu-pipete-online/index.md))
- Lietuvių (lt): [Spalvų pipetė](https://acrafto.com/lt/image-color-picker/) ([Markdown](https://acrafto.com/lt/image-color-picker/index.md))
- Svenska (sv): [Färgplockare från bild](https://acrafto.com/sv/fargplockare-fran-bild/) ([Markdown](https://acrafto.com/sv/fargplockare-fran-bild/index.md))
- Dansk (da): [Farvekode fra billede](https://acrafto.com/da/farvevaelger-fra-billede/) ([Markdown](https://acrafto.com/da/farvevaelger-fra-billede/index.md))
- Suomi (fi): [Poimi väri kuvasta](https://acrafto.com/fi/kuvan-varinvalitsin/) ([Markdown](https://acrafto.com/fi/kuvan-varinvalitsin/index.md))
- Norsk (no): [Fargeplukker](https://acrafto.com/no/online-fargevelger/) ([Markdown](https://acrafto.com/no/online-fargevelger/index.md))
- Русский (ru): [Онлайн-пипетка](https://acrafto.com/ru/vybor-tsveta-iz-izobrazheniya-onlajn/) ([Markdown](https://acrafto.com/ru/vybor-tsveta-iz-izobrazheniya-onlajn/index.md))
- Српски (sr): [Kapaljka za boje](https://acrafto.com/sr/odabir-boje-sa-slike/) ([Markdown](https://acrafto.com/sr/odabir-boje-sa-slike/index.md))
- Македонски (mk): [Пипета за бои од слика](https://acrafto.com/mk/izbirac-boja/) ([Markdown](https://acrafto.com/mk/izbirac-boja/index.md))
- Bosanski (bs): [Kapaljka za boje](https://acrafto.com/bs/online-birac-boja/) ([Markdown](https://acrafto.com/bs/online-birac-boja/index.md))
- Shqip (sq): [Pikues ngjyrash nga imazhi](https://acrafto.com/sq/pikues-ngjyrash-online-imazhi/) ([Markdown](https://acrafto.com/sq/pikues-ngjyrash-online-imazhi/index.md))
- Türkçe (tr): [Resimden renk kodu bulma](https://acrafto.com/tr/resimden-renk-secici/) ([Markdown](https://acrafto.com/tr/resimden-renk-secici/index.md))
- 日本語 (ja): [画像スポイト](https://acrafto.com/ja/image-color-picker/) ([Markdown](https://acrafto.com/ja/image-color-picker/index.md))
- 한국어 (ko): [이미지 색상 추출기](https://acrafto.com/ko/image-color-picker/) ([Markdown](https://acrafto.com/ko/image-color-picker/index.md))
- العربية (ar): [استخراج اللون من الصورة](https://acrafto.com/ar/image-color-picker/) ([Markdown](https://acrafto.com/ar/image-color-picker/index.md))
- हिन्दी (hi): [इमेज कलर पिकर](https://acrafto.com/hi/online-color-picker-tool/) ([Markdown](https://acrafto.com/hi/online-color-picker-tool/index.md))
- Bahasa Indonesia (id): [Ambil warna dari gambar](https://acrafto.com/id/pemilih-warna-gambar-online/) ([Markdown](https://acrafto.com/id/pemilih-warna-gambar-online/index.md))
- Tiếng Việt (vi): [Lấy màu từ ảnh](https://acrafto.com/vi/image-color-picker-online/) ([Markdown](https://acrafto.com/vi/image-color-picker-online/index.md))
- ไทย (th): [ดูดสีจากรูปภาพ](https://acrafto.com/th/image-color-picker-online/) ([Markdown](https://acrafto.com/th/image-color-picker-online/index.md))
- עברית (he): [טפטפת צבעים](https://acrafto.com/he/image-color-picker/) ([Markdown](https://acrafto.com/he/image-color-picker/index.md))