Онлайн пипетка за цвят от снимка

Acrafto Team Изображения
Актуализирано

Плъзнете изображение тук

Поддържани формати: JPG, PNG, WebP, GIF

Трябва ли да разберете кой цвят е използван в лого, снимка или скрийншот? Качете изображението, преместете курсора върху мястото, което ви интересува, и кликнете. Кодът на цвета веднага отива в клипборда във формата, който изберете: HEX, RGB, HSL, HSV или LCH. Нищо не инсталирате, а изображението не напуска вашия компютър.

Как да разберете цвета от изображение

  1. Качете изображение. Плъзнете го в прозореца или кликнете на „Преглед на файлове“. Пипетката приема JPG, PNG, WebP и GIF.
  2. Изберете формат. Над изображението изберете в какъв запис искате да копирате цвета. За уеб обикновено е подходящ HEX, а за графични програми RGB. Инструментът запомня избора ви.
  3. Преместете курсора върху цвета. До курсора се появява лупа с увеличени околни пиксели, а под нея се показва кодът на цвета.
  4. Кликнете. Кодът е в клипборда, а цветът се запазва в раздела „Избрани цветове“. Остава само да го поставите там, където ви трябва.

Искате да опитате с друго изображение? Плъзнете го направо върху текущото или го изтрийте с иконата на кошчето.

Какво умее онлайн пипетката

Лупа, която показва всеки пиксел

Обикновена пипета показва само цвета под курсора, а да уцелите тънкия ръб на буква е лотария. Нашата лупа увеличава околността на курсора до 11 × 11 пиксела и огражда централния. Виждате точно какво ще кликнете, преди да го направите.

Увеличение чак до отделни пиксели

С бутоните плюс и минус или с колелцето на мишката при задържан Ctrl приближавате изображението до 64 пъти. С включена мрежа виждате границите на пикселите, така че при икони, пиксел арт или дребен текст кликате точно там, където искате.

Цвят от оригинала, не от умалено копие

Много онлайн инструменти намаляват изображението и четат цвета от умалено копие, където съседните пиксели се сливат. Нашата пипетка работи с изображението в пълна разделителна способност (до 4096 px по дългата страна), така че получавате истинския цвят на пиксела.

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

Никакво маркиране на текст или преписване на числа. Всяко кликване върху изображението копира кода в избрания формат. Ако ви трябва същият цвят в друг запис, детайлите за цвета показват всичките пет формата, всеки със собствен бутон за копиране.

Палитра от доминиращи цветове

Веднага след качването инструментът намира до осем цвята, които преобладават в изображението, и ги показва в раздела „Доминиращи цветове“. Почти еднаквите нюанси се сливат, така че в палитрата няма да намерите пет варианта на сиво. Прозрачните части на PNG се пропускат. Палитрата е добра основа за цветова схема на уебсайт, презентация или публикации в социалните мрежи. Ако искате да проверите дали цветовете пазят достатъчен контраст и без нюанс, направете го бързо с преобразуване на изображението в сиви тонове.

Избрани цветове винаги пред очите ви

Всеки цвят, върху който кликнете, се запазва в раздела „Избрани цветове“ (последните 24). Можете да сравните няколко места в изображението и да се върнете към тях по всяко време. На голям екран панелът с цветовете е точно до изображението.

За какво служи да разберете кода на цвят от изображение

  • Уебсайтове и приложения: Клиентът е изпратил логото само като JPG, а вие имате нужда от точния цвят на марката за CSS. Ако ви трябва и версия с прозрачен фон, използвайте премахване на фона от изображение.
  • Графика и социални мрежи: Искате текстът в публикацията да пасва на снимката. Вземете цвета директно от нея.
  • Презентации и документи: Настройвате цветовете на фирменото лого в PowerPoint, Google Slides или Canva чрез HEX или RGB.
  • Проверка на дизайна: На скрийншот проверявате дали бутонът в приложението наистина е с цвета, предвиден от дизайна. Размерите на експортираните материали проверявате в анализа на размерите на изображения.
  • Интериор и мода: Имате снимка на плат или стена и търсите подобен нюанс. Кодът служи като отправна точка при избора от каталог с цветове.

Формати на цветовете, които връща пипетката

  • HEX (#1373b6): запис за HTML, CSS и повечето графични инструменти.
  • RGB (rgb(19, 115, 182)): дял на червено, зелено и синьо, всяко от 0 до 255. Как работи адитивното смесване на цветовете, обяснява Уикипедия.
  • HSL (hsl(205, 81%, 39%)): нюанс, наситеност и светлост. Лесно получавате по-светъл или по-тъмен вариант.
  • HSV: нюанс, наситеност и яркост, познати от избора на цвят в Photoshop или GIMP. Разликата между HSL и HSV подробно обяснява Wikipedia (на английски).
  • LCH: модел, който отговаря на начина, по който човешкото око възприема цветовете. Копира се в запис, който разбира съвременният CSS (виж документацията на MDN, на английски).

Пипетката открива цвета от изображение. Ако искате да го обработите допълнително, да го преобразувате в други формати или да намерите подходящи нюанси към него, продължете към цветовото колело.

Често задавани въпроси

Качва ли се изображението ми на сървър? Не. Изображението се зарежда и обработва направо във вашия браузър, никъде не се изпраща и след затваряне на страницата нищо не остава. Затова спокойно можете да ползвате пипетката и за вътрешни материали или непубликувани проекти.
Как да разбера HEX кода на цвят от снимка? Качете снимката, оставете избран формат HEX над изображението и кликнете върху мястото с цвета, който търсите. Кодът, например #75dab2, веднага е в клипборда ви.
Защо цветът от снимка се различава от реалния? Фотоапаратът влияе на цветовете чрез осветлението, баланса на бялото (на английски) и компресията. Пипетката връща точно цвета, записан във файла. При снимки кликнете на няколко места и ги сравнете в раздела „Избрани цветове“. Ако смесвате боя по кода, приемайте го само като ориентир.
Работи ли пипетката на телефон? Да. На сензорен екран докосвате мястото в изображението и кодът се копира както на компютър. Лупата до курсора не се показва на мобилни устройства, затова при дребни детайли първо увеличете изображението.
Каква е разликата между HEX и RGB? Двата записа описват един и същ цвят. RGB го изразява с три числа от 0 до 255, HEX записва същите числа в шестнайсетична бройна система след знака #. Например rgb(255, 87, 51) е същото като #ff5733.
Как да получа цялата цветова палитра от изображение? Отворете раздела „Доминиращи цветове“. В него ще намерите до осем основни цвята на изображението, а с кликване върху всеки от тях копирате неговия код.

Бих се радвал, ако споделите тези страници с приятели, ги запазите в отметки или ги свържете. Благодаря! 🙏