Hopp til hovedinnhold
LibraTool logoLibraTool

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.

Fungerer uten nett når den er lastet

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

Bla gjennom filer

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.

  1. 1
    Canvas leser pikseldata
    Bildet 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.
  2. 2
    k-means++ grupperer pikslene
    En 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.
  3. 3
    Metadata beregnes per farge
    Hver 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.
  4. 4
    Eksport og pipette
    Paletten 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

Ofte stilte spørsmål