Přesná analýza pixelů a barev z obrázku
Nástroj Kapátko na barvy z obrázku slouží k přesnému určení a exportu barevných hodnot z digitálních snímků přímo ve webovém prohlížeči. Po načtení souboru z lokálního úložiště lze analyzovat jednotlivé pixely a získat jejich parametry v nejpoužívanějších barevných modelech. Pro zajištění maximální přesnosti při výběru je rozhraní vybaveno zvětšenou lupou, která zobrazuje detailní mřížku pixelů v okolí kurzoru.
Zpracování grafických dat probíhá lokálně. Obrázek se načítá přímo z vašeho zařízení a nikdy neopustí váš prohlížeč. Na servery BroBroGo se nic nenahrává, což zajišťuje, že s vašimi soubory není manipulováno na žádném externím úložišti.
Podporované formáty a limity souborů
Do rozhraní lze vložit jeden obrázek v široké škále běžných i moderních formátů. Podporovány jsou následující typy souborů a jejich odpovídající MIME typy:
- PNG (
image/png) - JPG / JPEG (
image/jpeg) - WebP (
image/webp) - GIF (
image/gif) - AVIF (
image/avif) - HEIC / HEIF (
image/heic,image/heif)
Při importu souboru platí specifická pravidla pro zpracování rozměrů a chybových stavů:
- Změna velikosti: Pokud má načtený obrázek nejdelší stranu delší než 4096 pixelů, je automaticky zmenšen.
- Nepodporovaný formát: V případě pokusu o vložení nepodporovaného typu souboru se zobrazí chybové hlášení: „Tento typ souboru není podporován. Zkuste obrázek ve formátu PNG, JPG, WebP, GIF, AVIF nebo HEIC.“
- Poškozený soubor: Pokud soubor nelze dekódovat, systém zobrazí varování: „Obrázek se nepodařilo otevřít. Může být poškozený nebo v nepodporovaném formátu.“
Metodika vzorkování a ovládání
Jakmile je obrázek úspěšně načten, rozhraní zobrazí stavový řádek „Obrázek je připraven – přejížděním vybírejte, kliknutím barvu uložte.“ Nástroj okamžitě určí a zobrazí barevné hodnoty a souřadnice středového pixelu daného snímku.
Pro navigaci a výběr barev lze využít dva režimy:
- Pohyb ukazatelem: Přejížděním myší nebo jiným polohovacím zařízením nad obrázkem dochází k okamžitému vzorkování barev pixel po pixelu. Kliknutím na konkrétní místo se aktuálně vybraná barva uloží do historie.
- Klávesnice: Pro jemné doladění pozice lze po kliknutí na obrázek pohybovat zaměřovacím křížem pomocí směrových šipek. Jedno stisknutí šipky posune zaměřovač o přesně 1 pixel. Pro rychlejší pohyb lze podržet klávesu Shift, což zvýší krok posunu na 10 pixelů. Uložení aktuálně zaměřené barvy do historie se provádí stisknutím klávesy Enter nebo Space.
Výstupní barevné modely a správa historie
Nástroj poskytuje detailní informace o vybraném bodu. Zobrazuje rozměry obrázku, přesné souřadnice pixelu a jeho barevné vyjádření ve třech formátech:
- HEX: Šesticiferný hexadecimální kód (např. #ffffff) používaný primárně v HTML a CSS.
- RGB: Hodnoty červené (Red), zelené (Green) a modré (Blue) složky v rozsahu 0 až 255.
- HSL: Hodnoty odstínu (Hue v stupních 0°–360°), sytosti (Saturation v procentech) a jasu (Lightness v procentech).
Práce s průhledností (Alpha kanál)
Pokud vybraný pixel obsahuje informaci o průhlednosti, nástroj přečte jeho přesnou hodnotu uloženou v souboru, aniž by bral v úvahu pozadí, na kterém je vykreslen. V takovém případě se zobrazí upozornění ve formátu: „Alfa {n}% — tento pixel je částečně průhledný.“ (kde {n} představuje konkrétní procento neprůhlednosti).
Kopírování a historie
Kliknutím na jakoukoli zobrazenou hodnotu (HEX, RGB, HSL) se daný řetězec automaticky zkopíruje do schránky operačního systému. Pokud prohlížeč z bezpečnostních důvodů přístup ke schránce zablokuje, zobrazí se zpráva: „Nepodařilo se zkopírovat – váš prohlížeč zablokoval přístup ke schránce.“
Při uložení barvy (kliknutím nebo klávesou Enter/Space) se zobrazí potvrzení „Barva {hex} byla uložena do vašeho výběru.“ Historie uložených barev funguje podle následujících pravidel:
- Kapacita paměti je omezena na maximálně 12 položek.
- Pokud mají dvě barvy identické hodnoty RGB, ale liší se parametrem průhlednosti (alpha), uloží se do historie jako samostatné záznamy.
- Kliknutím na libovolný barevný vzorek v historii se daná barva opětovně načte do hlavního panelu podrobností.
Pro úplné vyčištění rozhraní slouží tlačítko „Začít znovu“, které odstraní načtený obrázek, vymaže celou historii uložených barev a vrátí nástroj do výchozího stavu.
Vliv komprese a vyhlazování na přesnost barev
Při analýze digitálního obrazu je nutné počítat s tím, že vizuální vjem nemusí vždy odpovídat exaktní hodnotě pixelu. Nástroj zobrazuje přesné hodnoty, které jsou fyzicky zapsány v souboru. Tyto hodnoty mohou být ovlivněny dvěma faktory:
- Ztrátová komprese (např. u formátu JPEG): Kompresní algoritmy sdružují podobné pixely do bloků, aby zmenšily velikost souboru. To způsobuje drobné barevné odchylky (artefakty), takže barva pixelu se může mírně lišit od původní předlohy.
- Vyhlazování hran (Anti-aliasing): Při vykreslování textu, křivek nebo šikmých hran dochází k softwarovému míchání barev na okrajích objektů, aby přechody působily plynule. Pixel na rozhraní dvou kontrastních ploch tak bude mít smíšenou barvu, která neodpovídá ani jedné z původních čistých barev.
Často kladené otázky
Jak mohu vybrat barvu z obrázku?
Přejíždějte ukazatelem po obrázku a na panelu se zobrazí barva pod ním. Vestavěná lupa vám pomůže zaměřit přesný pixel. Kliknutím barvu uložíte do svého výběru. Můžete také kliknout na obrázek a pohybovat zaměřovačem pomocí šipek na klávesnici a poté stisknout Enter.
Které formáty barev získám?
Každý vybraný pixel se zobrazí současně ve formátech HEX, RGB a HSL. Kliknutím na libovolnou hodnotu ji zkopírujete a můžete ji ihned vložit do CSS nebo grafického nástroje.
Proč vybraná barva neodpovídá vždy tomu, co jsem očekával?
Získáte přesnou hodnotu pixelu uloženou v obrázku. Pokud se jedná o JPEG nebo snímek obrazovky, komprese a vyhlazování hran (anti-aliasing) mohly okolní pixely mírně posunout. Poloprůhledný pixel se navíc načítá samostatně, bez ohledu na to, co se nachází za ním.