Gratis Billedfarvepalette-udtrækker
Udtræk de dominerende farver fra et billede ved hjælp af k-means farvekvanticering. Få hex-koder for de 2-16 øverste farver i dit foto eller logo.
Slip en fil her, eller klik for at vælge
JPG, PNG, WebP, GIF, HEIC, HEIF · behandles på din enhed
eller tryk Ctrl+V for at indsætte fra udklipsholderen
Tip: du kan indsætte et skærmbillede med Ctrl+V
Dine filer forlader aldrig din enhed. Al behandling sker lokalt i din browser.
Almindelige anvendelser
- Udtræk brandfarver fra en logoFå de nøjagtige hex-koder for de dominerende farver i enhver logo eller brandimage.
- Byg webfarvepaletter fra fotosGenerer matchende webstedsfarvepaletter fra herofotos eller baggrundsbilleder.
- Udtræk farver fra inspirationsfotosUdtræk farvepaletter fra indretnings- eller modefoto til brug i dine egne projekter.
- Analyser malerier og kunstpaletterStuder farvepaletter fra berømte malerier eller dine egne kunstværker ved at udtrække de dominerende farver.
- Tema CSS fra billederGenerer CSS-variabeltemaer fra billeder — brugbar til dynamisk tematisering eller automatisk genererede farveskemaer.
Sådan fungerer det
Farveudtrækning kører udelukkende i din browser med en håndskrevet k-means++-klyngealgoritme anvendt på rå pixeldata læst fra Canvas API — ingen server, intet tredjepartsbibliotek. Samme billede og antal farver giver altid samme palet, fordi algoritmen bruger en deterministisk pseudotilfældig talgenerator (mulberry32) i stedet for Math.random.
- 1Canvas læser pixeldataBilledet tegnes på et usynligt HTML Canvas-element og nedskaleres til højst 200px på den længste side. Canvas API's getImageData() returnerer hver pixel som rå RGBA-bytes, og helt gennemsigtige pixels (alpha < 128) kasseres, før klyngedannelsen begynder.
- 2k-means++ grupperer pixelerneEn k-means++-initialisering placerer centroiderne deterministisk, og algoritmen gentager op til 20 gange: hver pixel tildeles den nærmeste centroid i RGB-rummet, og centroiderne genberegnes som gennemsnittet af alle tildelte pixels. Klynger, der ender med samme hex-værdi, slås sammen, så hver farveprøve i resultatet er unik.
- 3Metadata pr. farve beregnesHver centroid omregnes til HEX, HSL og dens andel af alle pixels (procent). WCAG-relativ luminans beregnes efter standardformlen, og kontrastforhold mod både sort og hvid vises ved hver farveprøve.
- 4Eksport og pipette-outputPaletten kan kopieres som CSS custom properties, SCSS-variabler, et Tailwind-konfigurationsudsnit eller JSON. En klik-for-at-hente-pipette omsætter dit klik på forhåndsvisningen til de præcise pixelkoordinater i kilden på et lærred i fuld opløsning og føjer pixelens farve til en separat liste over valgte farver. En PNG-farvestribe kan downloades via Canvas toBlob().
Dit billede uploades aldrig — det afkodes og behandles udelukkende i browserens hukommelse, og kun filstørrelsen (i KB) rapporteres til statistik.
Relaterede værktøjer
Tilfældig farvegenerator
Generer tilfældige farver én ad gangen eller som en palet på fem, lås dem du kan lide, kopiér HEX-, RGB- eller HSL-værdier og eksportér paletten som PNG eller CSS.
Farvepalet-generator
Generer komplementære, analoge, triadiske og monokamatiske farvepaletter fra en vilkårlig basisfarve. Kopiér hex-koder med ét klik.
Farvevælger og palettegenerator
Vælg farver, konverter mellem HEX/RGB/HSL og generer harmoniske paletter.