Gratis Bilde-fargepalettuttrekker
Trekk ut de dominerende fargene fra et bilde ved hjelp av k-means fargekvantisering. Få hex-koder for de 2–16 øverste fargene i bildet eller logoen.
Slipp en fil her, eller klikk for å bla
JPG, PNG, WebP, GIF, HEIC, HEIF · behandles på enheten din
eller trykk Ctrl+V for å lime inn fra utklippstavlen
Tips: du kan lime inn et skjermbilde med Ctrl+V
Filene dine forlater aldri enheten. All behandling skjer lokalt i nettleseren din.
Vanlige bruksområder
- Trekk ut merkefarger fra en logoFå nøyaktige hex-koder for dominerende farger i hvilken som helst logo eller merke-bilde.
- Bygge nettfargpaletter fra bilderGenerer matchende nettsted fargepaletter fra hero-bilder eller bakgrunnsbilder.
- Trekk ut farger fra inspirasjon-bilderTrekk ut fargepaletter fra interior design eller mode-bilder for bruk i dine egne prosjekter.
- Analyser maleri og kunstpaletterStuder fargepaletter fra kjente malerier eller dine egne kunstverk ved å trekke ut dominerende farger.
- Tema CSS fra bilderGenerer CSS-variabeltemaer fra bilder — nyttig for dynamisk tema eller automatisk genererte fargeskjemaer.
Hvordan det fungerer
Fargeuttrekket kjører helt i nettleseren med en håndskrevet k-means++-klyngealgoritme brukt på rå pikseldata lest fra Canvas API — ingen server, ingen tredjepartsbibliotek. Samme bilde og samme antall farger gir alltid samme palett, fordi algoritmen bruker en deterministisk pseudotilfeldig tallgenerator (mulberry32) i stedet for Math.random.
- 1Canvas leser pikseldataBildet tegnes på et HTML Canvas-element utenfor skjermen og nedskaleres til høyst 200px på den lengste siden. Canvas-API-ets getImageData() returnerer hver piksel som rå RGBA-byte, og helt gjennomsiktige piksler (alfa < 128) forkastes før klyngingen starter.
- 2k-means++ grupperer piksleneEn k-means++-initialisering setter startsentroidene deterministisk, og algoritmen itererer opptil 20 ganger: hver piksel tilordnes nærmeste sentroide i RGB-rommet, og sentroidene beregnes på nytt som gjennomsnittet av alle tilordnede piksler. Klynger som ender med samme heksadesimale verdi slås sammen, så hver fargeprøve i resultatet er unik.
- 3Metadata beregnes per fargeHver sentroide konverteres til HEX, HSL og sin andel av alle piksler (prosent). Relativ luminans etter WCAG beregnes med standardformelen, og kontrastforholdet mot både svart og hvitt vises ved hver fargeprøve.
- 4Eksport og pipettePaletten kan kopieres som egendefinerte CSS-egenskaper, SCSS-variabler, et utdrag av Tailwind-konfigurasjon eller JSON. En pipette der du klikker for å hente farge, kobler klikket i forhåndsvisningen til de nøyaktige pikselkoordinatene i kilden på et lerret i full oppløsning, og legger fargen til en egen liste over valgte farger. En PNG-palettstripe kan lastes ned via Canvas toBlob().
Bildet ditt lastes aldri opp — det dekodes og behandles helt i nettleserens minne, og bare filstørrelsen (i KB) rapporteres til analyse.
Relaterte verktøy
Tilfeldig fargegenerator
Lag tilfeldige farger én om gangen eller som en palett på fem, lås de du liker, kopier HEX-, RGB- eller HSL-verdier og eksporter paletten som PNG eller CSS.
Fargepalettgenerator
Generer komplementære, analoge, triadiske og monokromatiske fargepaletter fra en hvilken som helst basisfarge. Kopier hex-koder med ett klikk.
Fargevelger og palettgenerator
Velg farger, konverter mellom HEX/RGB/HSL og generer harmoniske paletter.