Slaan oor na hoofinhoud
LibraTool logoLibraTool

Gratis Beeldkleurpaletuittrekker

Onttrek die dominante kleure uit enige beeld deur gebruik te maak van k-beteken kleurkwantisering. Kry hekskodes vir die top 2-16 kleure in jou foto of logo.

Werk vanlyn sodra gelaai

Los 'n lêer hier, of klik om te soek

JPG, PNG, WebP, GIF, HEIC, HEIF · op jou toestel verwerk

of druk Ctrl+V om vanaf jou knipbord te plak

Blaai deur lêers

Wenk: jy kan 'n skermkiekie met Ctrl+V plak

Jou lêers verlaat nooit jou toestel nie. Alle verwerking gebeur plaaslik in jou blaaier.

Algemene gebruike

  • Haal Handels Kleure uit Logo'sKry die presiese heksadesimaalkodes vir die oorheersende kleure in enige logo of handelsmerk-beeld.
  • Bou Webkleurpalette uit Foto'sGenereer ooreenkoms webwerf-kleurpalette uit helofoto's of agtergrondbeelde.
  • Haal Kleure uit Inspirasie-foto'sTrek kleurpalette uit binnenshuise ontwerp- of modefoto's om in jou eie projekte te gebruik.
  • Analiseer Skildery- en KunstpaletteBestudeer die kleurpalette van beroemde skilderye of jou eie kuns deur die oorheersende kleure uit te trek.
  • Tema CSS uit BeeldeGenereer CSS-veranderlike temas uit beelde — nuttig vir dinamiese temaverlening of auto-gegenereerde kleurskema's.

Hoe dit werk

Kleuronttrekking loop heeltemal in jou blaaier met 'n handgeskrewe k-middels++-groeperingsalgoritme toegepas op rou pixeldata gelees vanaf die Canvas-API — geen bediener, geen derdeparty-biblioteek nie. Dieselfde beeld- en kleurtelling-instellings produseer altyd dieselfde palet omdat die algoritme 'n deterministiese pseudo-lukrake-getalgenerator (mulberry32) gebruik eerder as Math.random.

  1. 1
    Canvas lees pixeldata
    Die beeld word op 'n skerm-af HTML-Canvas-element geteken en na hoogstens 200px op sy langste kant afgemonster. Die Canvas-API se getImageData() gee elke pixel as rou RGBA-grepe terug, en heeltemal deursigtige pixels (alfa < 128) word verwerp voordat groepering begin.
  2. 2
    k-middels++ groepeer die pixels
    'n k-middels++-inisialiseerder saai die sentroïdes deterministies, dan herhaal die algoritme tot 20 keer: elke pixel word aan sy naaste sentroïde in RGB-ruimte toegeken, dan word sentroïdes herbereken as die gemiddelde van alle toegekende pixels. Groeperings wat na dieselfde heks-waarde ineenstort word saamgevoeg, sodat elke kleurstaal in die resultaat uniek is.
  3. 3
    Per-kleur-metadata word bereken
    Elke sentroïde word na HEKS, HSL, en sy aandeel van totale pixels (persentasie) omgeskakel. WCAG-relatiewe luminansie word volgens die standaardformule bereken, en kontrasverhoudings teen beide swart en wit word langs elke kleurstaal gewys.
  4. 4
    Uitvoer- en oogdruppelaar-uitset
    Die palet kan as CSS-pasgemaakte-eienskappe, SCSS-veranderlikes, 'n Tailwind-konfigurasiesnit, of JSON gekopieer word. 'n Klik-om-te-monster-oogdruppelaar karteer jou klik op die voorskou terug na die presiese bronpixel-koördinate op 'n volresolusie-canvas, en voeg daardie pixel se kleur by 'n aparte gekose-kleure-lys. 'n PNG-paletstrook kan via Canvas toBlob() afgelaai word.

Jou beeld word nooit opgelaai nie — dit word heeltemal in jou blaaier se geheue gedekodeer en verwerk, en slegs die lêergrootte (in KB) word aan analitiek gerapporteer.

Verwante gereedskap

🎨

Ewekansige kleurgenerator

Genereer ewekansige kleure een op 'n slag of as 'n palet van vyf, sluit die wat jy hou, kopieer HEX-, RGB- of HSL-waardes en voer die palet uit as PNG of CSS.

Probeer dit
🎨

Kleurpaletgenerator

Genereer komplementêre, analoog, triadiese en monochromatiese kleurpalette van enige basiskleur. Kopieer hekskodes met een klik.

Probeer dit
🎨

Kleurkeuser en paletgenerator

Kies kleure, skakel om tussen HEX/RGB/HSL, en genereer harmonieuse palette.

Probeer dit

Gereelde vrae