Pro Estrattore di Palette — Palette in HEX, HSL, OKLCH, CMYK
Estrai da 3 a 16 colori dominanti da qualsiasi immagine in HEX, RGB, HSL, OKLCH e CMYK. Esporta in CSS, SCSS, Tailwind, JSON o palette PNG. Al 100% nel tuo browser.
Pro Estrattore di Palette — Palette di Colori per Designer e Front-End Pro
Trascina qualsiasi immagine ed estrai una palette di alta qualità da 3 a 16 colori dominanti — con tutti i codici di cui hai bisogno: HEX, RGB, HSL, OKLCH e CMYK. Ordina per dominanza, luminosità o tonalità, visualizza una barra percentuale della presenza di ogni colore nell’immagine, mostra opzionalmente il colore complementare di ogni campione, ed esporta la tua palette come variabili CSS, variabili SCSS, snippet di config Tailwind, JSON, lista hex semplice, o un’immagine PNG scaricabile.
Cinque codici colore per campione
Clicca su qualsiasi codice per copiarlo. HEX è il più comune sul web; RGB è il valore grezzo a 8 bit; HSL è tonalità / saturazione / luminosità, ottimo per creare sfumature e ombre; OKLCH è lo spazio colore moderno e percettivamente uniforme supportato da CSS Color Level 4 — perfetto per palette accessibili e armoniose; CMYK è l’approssimazione per il design di stampa (modello sottrattivo).
Sei formati di esportazione
Variabili CSS (:root { --color-1: ... }), variabili SCSS ($color-1, $color-2…), snippet Tailwind da incollare sotto extend.colors, JSON con tutti i codici e la percentuale di dominanza, lista hex semplice, e un’immagine PNG di palette scaricabile a 1200×600 con etichette HEX e RGB sotto ogni campione — ottimo per condividere su Dribbble o nelle specifiche di design.
Modalità di ordinamento & armonie
Dominanza: colori più presenti prima — la palette fotografica. Luminosità: dalla più chiara alla più scura — utile per le rampe di valore UI. Tonalità: in ordine cromatico rosso → arancione → giallo → verde → blu → viola — utile per campioni arcobaleno e ispirazione per gradienti. Il toggle complementare mostra un piccolo triangolo della tonalità opposta nell’angolo di ogni chip — perfetto per individuare opportunità di colore d’accento.
Consigli
Per i migliori risultati, usa una foto chiara e ben illuminata con temi visivi forti. Aumenta il numero di colori quando l’immagine è varia; diminuiscilo per una palette mirata “pronta per logo”. La barra di dominanza viene calcolata DOPO che l’immagine è stata sottocampionata a circa 200×200 (per velocità) e raggruppa i pixel in cluster con l’algoritmo Median Cut — lo stesso metodo usato nella quantizzazione classica delle immagini.
Privacy
Questo strumento funziona al 100% nel tuo browser. La tua immagine viene letta nella memoria del browser tramite l’API FileReader e non viene mai caricata su nessun server. Niente IA, niente servizio esterno, niente libreria da scaricare — solo matematica JavaScript pura sui pixel dell’immagine. Niente viene memorizzato; chiudere la scheda cancella tutto.
Ricerca semplice e veloce? Prova Estrattore di Colori da Immagine.