CodeKitHub
Zašto smo u birač boja dodali automatsko izdvajanje palete

Zašto smo u birač boja dodali automatsko izdvajanje palete

Objavljeno 5. kol 2026.

Naš birač boja oduvijek vam omogućuje da učitate sliku i klikom na bilo koji piksel dobijete njegovu točnu HEX, RGB i HSL vrijednost. To odgovara na pitanje “koje je boje ova konkretna točka?” — korisno, ali nije pitanje koje većina ljudi zapravo ima kad učita fotografiju. Obično je to “koja je ukupna shema boja ove slike?” — izvlačenje brend palete iz logotipa ili prenošenje ugođaja referentne fotografije u shemu boja web-stranice.

Uzorkovanje jednog piksela na to ne može odgovoriti. Zato smo dodali izdvajanje palete: učitajte sliku i alat sada automatski izvlači osam najdominantnijih boja te ih prikazuje kao klikabilne uzorke.

Kako radi

Nema nikakvog AI modela i ništa se nigdje ne učitava — riječ je o jednostavnom algoritmu brojanja učestalosti koji se izvrši u nekoliko milisekundi:

  1. Slika se smanjuje na platno od 80×80. Puna rezolucija nije potrebna za statistiku boja, a smanjivanje čini cijeli postupak trenutačnim čak i za velike fotografije.
  2. Svaki piksel svrstava se u “koš” prema pojednostavljenoj verziji svoje boje — gornjih 5 bitova svakog RGB kanala, tako da pikseli koji su vizualno gotovo identični završe u istom košu umjesto da se svaki broji kao jedinstvena boja.
  3. Koševi se sortiraju prema broju piksela koji su u njih upali, a osam najvećih postaje paleta, pri čemu se svaki prikazuje kao prosječna boja svega u tom košu.

To je sve. Bez strojnog učenja, bez vanjskog servisa — samo smanjivanje i brojanje, zbog čega je postupak trenutačan i nikad ne napušta vaš preglednik.

Kliknite uzorak, dobijte kod

Svaki uzorak palete je klikabilan: kliknite jedan i on postaje aktivna boja alata, s automatski popunjenim HEX, RGB i HSL vrijednostima i hex kodom kopiranim u međuspremnik istim klikom. Postoji i gumb “copy all” ako želite cijelu paletu kao popis odvojen zarezima, koristan za lijepljenje izravno u dizajnerski alat ili blok CSS custom-properties.

Isprobajte

Učitajte bilo koju sliku — snimku zaslona, logotip, fotografiju — na stranici birača boja i paleta se automatski pojavljuje ispod.

← Natrag na blog