Ekstraktor palete boja iz slike — besplatno
Izvucite dominantne boje iz bilo koje slike koristeći k-means kvantizaciju boja. Dobijte hex kodove za 2–16 najzastupljenijih boja u vašoj fotografiji ili logotipu.
Prevucite datoteku ovde ili kliknite da izaberete
JPG, PNG, WebP, GIF, HEIC, HEIF · obrađeno na vašem uređaju
ili pritisnite Ctrl+V da nalepite iz privremene memorije
Savet: sliku ekrana možete nalepiti pomoću Ctrl+V
Vaši fajlovi nikada ne napuštaju vaš uređaj. Sva obrada se odvija lokalno u vašem pregledaču.
Uobičajene upotrebe
- Ekstraktujte boje brendova iz logotipaDobijte tačne heksadecimalne kodove za dominantne boje u bilo kom logotipu ili slici brendu.
- Kreirajte web palete boja iz fotografijaGenerirajte usklađene palete boja vebsajta iz herojskih fotografija ili slika pozadine.
- Ekstraktujte boje iz inspirativnih fotografijaIzvucite palete boja iz interijera ili modnih fotografija za upotrebu u vlastitim projektima.
- Analizirajte palete slika i umetnostiProučavajte palete boja čuvenih slika ili vlastite umetnosti ekstraktovanjem dominantnih boja.
- CSS tema iz slikaGenerirajte CSS varijabilne teme iz slika - korisno za dinamičku tematizaciju ili automatski generisane šeme boja.
Kako funkcioniše
Izdvajanje boja se u potpunosti izvršava u vašem pregledaču koristeći ručno napisan algoritam grupisanja k-means++ primenjen na sirove podatke piksela pročitane iz Canvas API-ja — bez servera, bez biblioteke trećih strana. Ista slika i podešavanja broja boja uvek proizvode istu paletu jer algoritam koristi deterministički pseudo-slučajni generator brojeva (mulberry32) umesto Math.random.
- 1Canvas čita podatke pikselaSlika se crta na van-ekranski HTML Canvas element i smanjuje na najviše 200px na svojoj dužoj strani. getImageData() Canvas API-ja vraća svaki piksel kao sirove RGBA bajtove, a potpuno providni pikseli (alfa < 128) se odbacuju pre nego što grupisanje počne.
- 2k-means++ grupiše pikseleInicijalizator k-means++ deterministički zaseje centroide, zatim algoritam iterira do 20 puta: svaki piksel se dodeljuje najbližem centroidu u RGB prostoru, zatim se centroidi ponovo izračunavaju kao srednja vrednost svih dodeljenih piksela. Grupe koje se svedu na istu heksadecimalnu vrednost se spajaju, tako da je svaki uzorak u rezultatu jedinstven.
- 3Izračunavaju se metapodaci po bojiSvaki centroid se konvertuje u HEX, HSL, i njegov udeo u ukupnim pikselima (procenat). WCAG relativna luminanca se izračunava prema standardnoj formuli, i odnosi kontrasta naspram crne i bele se prikazuju uz svaki uzorak.
- 4Izvoz i izlaz kapaljke za bojuPaleta se može kopirati kao prilagođena CSS svojstva, SCSS promenljive, Tailwind konfiguracioni isečak, ili JSON. Kapaljka klik-za-uzorkovanje mapira vaš klik na pregledu nazad na tačne koordinate izvornog piksela na platnu pune rezolucije, dodajući boju tog piksela u odvojenu listu izabranih boja. Traka palete u PNG-u se može preuzeti preko Canvas toBlob().
Vaša slika se nikada ne otprema — dekodira se i obrađuje u potpunosti u memoriji vašeg pregledača, i samo se veličina fajla (u KB) prijavljuje analitici.
Slične alatke
Generator nasumičnih boja
Generišite nasumične boje jednu po jednu ili kao paletu od pet, zaključajte one koje vam se sviđaju, kopirajte HEX, RGB ili HSL vrednosti i izvezite paletu kao PNG ili CSS.
Generator palete boja
Generišite komplementarne, analogne, trijadne i monohromatske palete boja iz bilo koje osnovne boje. Kopirajte hex kodove jednim klikom.
Birač boja i generator palete
Birajte boje, konvertujte između HEX/RGB/HSL i generišite harmonične palete.