Ingyenes Kép színpaletta kinyerő
Nyerd ki a domináns színeket bármely képből k-means színkvantálással. Kapj hex-kódokat a fotód vagy logód 2–16 legfőbb színéhez.
Húzza ide a fájlt, vagy kattintson a tallózáshoz
JPG, PNG, WebP, GIF, HEIC, HEIF · az eszközödön dolgozza fel
vagy nyomjon Ctrl+V-t a vágólapról való beillesztéshez
Tipp: képernyőképet a Ctrl+V billentyűkkel illeszthetsz be
Az Ön fájljai soha nem hagyják el az eszközét. Minden feldolgozás helyileg történik a böngészőjében.
Gyakori felhasználások
- A márka szín kiemelése a logóbólSzerezzen be pontos hex kódokat bármely logó vagy márkaképben a domináns szín számára.
- Web szín palettákat hozhat létre a fotóibólWebes szín palettákat hozhat létre, amelyek megfelelnek a hős fotóknál vagy háttér képeknél.
- Szín kiemelése az inspiráció fotóibólSzín palettákat szúrjon ki a belső vagy divat fotóból a saját projektekhez való felhasználásra.
- Elemezze a festmény és képzőművészeti palettákatTanulmányozza a híres festmények vagy saját művészete szín palettáit a domináns színek kiemelésével.
- Téma CSS képekbőlCSS változó témákat hozhat létre képekből — hasznos dinamikus témákhoz vagy automatikusan generált szín sémákhoz.
Hogyan működik
A színkivonatolás teljesen a böngészőjében fut egy kézzel írt k-means++ klaszterező algoritmussal, amely a Canvas API-ból olvasott nyers pixeladatokra kerül alkalmazásra — nincs szerver, nincs harmadik féltől származó könyvtár. Ugyanaz a kép és szín-szám beállítás mindig ugyanazt a palettát adja, mert az algoritmus determinisztikus pszeudo-véletlenszám-generátort (mulberry32) használ a Math.random helyett.
- 1A Canvas beolvassa a pixeladatokatA kép egy képernyőn kívüli HTML Canvas elemre kerül rajzolásra, és legfeljebb 200px-re kerül lecsökkentésre leghosszabb oldalán. A Canvas API getImageData() metódusa minden pixelt nyers RGBA bájtokként ad vissza, és a teljesen átlátszó pixelek (alfa < 128) eldobásra kerülnek a klaszterezés kezdete előtt.
- 2A k-means++ klaszterezi a pixeleketEgy k-means++ inicializáló determinisztikusan veti be a centroidokat, majd az algoritmus akár 20-szor iterál: minden pixel a legközelebbi centroidjához kerül hozzárendelésre RGB térben, majd a centroidok újraszámításra kerülnek az összes hozzárendelt pixel átlagaként. Az azonos hex-értékre összeomló klaszterek összevonásra kerülnek, így minden minta az eredményben egyedi.
- 3Színenkénti metaadatok kiszámítvaMinden centroid HEX-re, HSL-re és a teljes pixel-számból való részesedésére (százalékban) kerül átváltásra. A WCAG relatív fényerő a standard képlet szerint kerül kiszámításra, és a feketével és fehérrel szembeni kontrasztarányok minden minta mellett megjelennek.
- 4Export és pipetta-kimenetA paletta másolható CSS egyéni tulajdonságokként, SCSS változókként, egy Tailwind konfigurációs részletként vagy JSON-ként. Egy kattintásos mintavevő pipetta visszaképezi az előnézeten való kattintást a pontos forráspixel-koordinátákra egy teljes felbontású platnon, hozzáadva a pixel színét egy külön kiválasztott-színek listához. Egy PNG palettacsík letölthető a Canvas toBlob() segítségével.
Képe soha nem kerül feltöltésre — teljesen a böngésző memóriájában kerül dekódolásra és feldolgozásra, és csak a fájlméret (KB-ban) kerül jelentésre az analitikának.
Kapcsolódó eszközök
Véletlen színgenerátor
Generálj véletlen színeket egyesével vagy ötös palettaként, zárold a tetszőket, másold a HEX-, RGB- vagy HSL-értékeket, és exportáld a palettát PNG-ként vagy CSS-ként.
Színpaletta-generátor
Generálj komplementer, analóg, triádikus és monokormatikus színpalettákat bármely alapszínből. Másold a hex-kódokat egyetlen kattintással.
Színválasztó és paletta generátor
Válasszon színeket, konvertáljon HEX/RGB/HSL között, és generáljon harmonikus palettákat.