Пипета за боје са слике

Прецизно узорковање пиксела у веб-прегледачу

Алат „Пипета за боје са слике” омогућава корисницима да учитају локалну слику са свог уређаја и изврше прецизну анализу појединачних пиксела како би очитали њихове тачне колориметријске вредности. Након што се датотека учита, преласком показивача преко било ког дела слике активира се уграђена лупа која омогућава увећан приказ структуре пиксела. Овај систем омогућава кориснику да издвоји вредности боја у три стандардна формата: HEX, RGB и HSL.

Алат је у потпуности прилагођен потребама дизајнера који креирају корисничке интерфејсе (UI), програмера који преводе визуелна решења у CSS код, као и креатора садржаја који усклађују елементе бренда са постојећим графичким материјалима.

Подржани формати и техничка ограничења увоза

Алат прихвата једну сликовну датотеку по сесији. Да би се обезбедила исправна обрада унутар прегледача, датотека мора бити у једном од следећих формата:

• PNG (MIME тип: image/png)
• JPG / JPEG (MIME тип: image/jpeg)
• WebP (MIME тип: image/webp)
• GIF (MIME тип: image/gif)
• AVIF (MIME тип: image/avif)
• HEIC / HEIF (MIME типови: image/heic, image/heif)

Уколико корисник покуша да увезе датотеку чији формат није подржан, систем ће приказати обавештење: „Тај тип датотеке није подржан. Покушајте са PNG, JPG, WebP, GIF, AVIF или HEIC сликом.” У случајевима када је датотека оштећена или структура података не може бити декодирана, приказује се грешка: „Ову слику није могуће отворити. Можда је оштећена или је у неподржаном формату.”

За слике високе резолуције примењује се аутоматско скалирање: уколико је најдужа страница учитане слике већа од 4096 пиксела, слика се пропорционално умањује на ту граничну вредност како би се оптимизовале перформансе узорковања у реалном времену.

Функционалност интерфејса и излазни подаци

Када се слика успешно учита, алат аутоматски позиционира фокус на средишњи пиксел и одмах приказује његове координате и вредности боја. На екрану се појављује статус: „Слика је спремна — пређите преко ње да узмете узорак, кликните да сачувате боју.”

Током интеракције са сликом, кориснику су на располагању следећи излазни подаци и метаподаци:

• Димензије: Тачна ширина и висина учитане слике у пикселима.
• Пиксел: Тренутне X и Y координате показивача на слици.
• HEX: Шестоцифрени хексадецимални код боје (нпр. #FF5733).
• RGB: Вредности за црвени (Red), зелени (Green) и плави (Blue) канал у распону од 0 до 255.
• HSL: Вредности за нијансу (Hue) у степенима од 0° до 360°, као и засићеност (Saturation) и осветљеност (Lightness) изражене у процентима.

Сваки клик на приказану вредност (HEX, RGB или HSL) аутоматски копира тај податак у привремену меморију (clipboard) система, што олакшава брзу интеграцију у CSS или графичке програме. У случају да безбедносна подешавања веб-прегледача блокирају ову акцију, појавиће се порука: „Копирање није успело — ваш прегледач је блокирао приступ привременој меморији.”

Контрола помоћу тастатуре и прецизна навигација

Поред стандардне употребе миша или подлоге осетљиве на додир, алат подржава навигацију путем тастатуре како би се омогућило померање за тачно дефинисан број пиксела:

1. Померање за 1 пиксел: Притиском на тастере са стрелицама (лево, десно, горе, доле) нишан се помера за по један пиксел у жељеном смеру.
2. Померање за 10 пиксела: Држањем тастера Shift уз истовремено притискање тастера са стрелицама, нишан се помера у корацима од по 10 пиксела.
3. Чување боје: Притиском на тастер Enter или Space (размакница), тренутно селектована боја се трајно чува у историји избора.

Историја сачуваних боја и управљање меморијом

Клик на слику или притисак на тастере за потврду додаје тренутну боју у историју избора, уз пратеће обавештење: „Сачувано {hex} у ваше изборе.”

• Капацитет: Историја може да прими највише 12 сачуваних боја.
• Интеракција: Клик на било који сачувани узорак у историји поново учитава његове вредности у главни панел.
• Почетно стање: Када је историја празна, приказан је текст: „Боје које сачувате појавиће се овде — кликните на узорак да бисте га поново учитали.”
• Ресетовање: Клик на дугме „Почни поново” у потпуности чисти учитану слику, брише комплетну историју сачуваних боја и враћа алат у почетно стање.

Утицај компресије и транспарентности на вредности пиксела

Приликом анализе боја важно је узети у обзир техничке карактеристике саме слике:

• Компресија и анти-алиасинг: Алат приказује егзактну вредност пиксела која је записана у датотеци. Код JPEG формата или снимака екрана (screenshots), алгоритми за компресију и ублажавање ивица (anti-aliasing) често мењају оригиналне нијансе суседних пиксела. Због тога се очитана вредност може минимално разликовати од теоријске боје коју је дизајнер применио.
• Канал провидности (Алфа канал): Ако пиксел садржи делимичну провидност, алат очитава искључиво његову изворну вредност без утицаја позадине која се налази иза њега. У том случају, систем приказује упозорење: „Алфа {n}% — овај пиксел је делимично провидан.” (где је {n} проценат непровидности).
• Разликовање у историји: Боје које имају идентичне RGB вредности, али различите нивое провидности (алфа канале), третирају се као јединствени уноси и чувају се као засебне ставке у историји од 12 места.

Локална обрада података и приватност

Сви процеси декодирања слике, узорковања пиксела и чувања историје избора извршавају се локално, директно у веб-прегледачу корисника. Слика се чита непосредно са вашег уређаја и никада не напушта ваш прегледач. Никакви подаци нити сликовне датотеке се не отпремају на сервер BroBroGo.

---

Често постављана питања (FAQ)

Како да изаберем боју са слике?

Померите показивач преко слике и панел ће приказати боју испод њега, уз лупу која зумира како бисте могли да погодите тачан пиксел. Кликните да бисте сачували ту боју у своје изборе. Такође можете да фокусурате слику и померате нишан помоћу тастера са стрелицама, а затим притиснете Enter.

Које формате боја добијам?

Сваки пиксел чији узорак узмете приказује се истовремено у форматима HEX, RGB и HSL. Кликните на било коју вредност да бисте је копирали, спремну за лепљење у CSS или дизајнерски алат.

Зашто се одабрана боја не поклапа увек са оним што сам очекивао?

Добијате тачну вредност пиксела која је сачувана у слици. Ако је у питању JPEG или снимак екрана, компресија и анти-алиасинг су можда већ мало померили суседне пикселе, а делимично прозиран пиксел се чита сам за себе, без обзира на то шта се налази иза њега.

Колико боја могу истовремено да сачувам у историји?

Историја избора може да сачува највише 12 боја. Након што попуните свих 12 места, можете искористити опцију „Почни поново” како бисте испразнили историју и ресетовали алат за нову сесију.