Vai al contenuto
Color Palette Extractor

Estrattore gratuito di colori da immagini

Estrattore di palette di colori

L'Estrattore di palette di colori ricava i colori esatti da un'immagine e li restituisce come palette di colori con codici HEX, RGB, HSL, OKLCH e CMYK. Ogni colore mostra la sua quota dell'immagine, e l'immagine non lascia mai il tuo browser.

  • Gratis, senza registrazione
  • Le immagini non lasciano mai il tuo dispositivo
  • Colori esatti dei pixel
Estrai da

Trascina qui le immagini

JPG, PNG, WebP, GIF, AVIF, SVG. Fino a 20 immagini.

Come funziona l'estrattore di palette di colori?

L'estrattore di palette di colori legge i pixel della tua immagine nel browser, raggruppa i colori simili e restituisce i colori che descrivono meglio l'immagine.

  1. Aggiungi un'immagine

    Trascina, incolla o scegli fino a 20 immagini in formato JPG, PNG, WebP, GIF, AVIF o SVG. Funziona anche uno screenshot incollato.

  2. I colori vengono raggruppati

    L'estrattore raggruppa i pixel in OKLab, uno spazio colore costruito per rispecchiare la percezione umana del colore, e unisce i colori che appaiono uguali.

  3. Definisci la palette

    Imposta da 2 a 20 colori, scegli una modalità e clicca l'immagine per aggiungere qualsiasi pixel esatto. Trascina un segnaposto per prelevare di nuovo il suo colore.

  4. Copia o esporta

    Copia i codici HEX, verifica il contrasto o esporta la palette in CSS, Tailwind, Adobe, Procreate, GIMP e altri formati.

Cosa restituisce l'estrattore per ogni colore?

Ogni colore estratto restituisce sette codici colore, il nome del colore più vicino, la sua quota dell'immagine, il suo contrasto con il bianco e con il nero e una scala di varianti chiare e scure da 50 a 950.

Codici colore del colore di esempio #2A9D8F
CodiceEsempioUso
HEX#2A9D8FWeb design, CSS e la maggior parte delle app di design
RGBrgb(42 157 143)Schermi, CSS e editor di immagini
HSLhsl(173 58% 39%)Regolazione di luminosità e saturazione in CSS
HSBhsb(173, 73%, 62%)Selettori di colore di Photoshop, Figma e Procreate
OKLCHoklch(63% 0.101 183)Modifica percettiva del colore nel CSS moderno
CIE Lablab(58.4 -35.2 -2.3)Misurazione della differenza di colore e flussi di lavoro di stampa
CMYK73, 0, 9, 38Stime di stampa senza un profilo della stampante

Quale modalità di estrazione è adatta alla tua immagine?

La modalità di estrazione decide quali colori entrano nella palette quando un'immagine contiene più colori della dimensione della palette.

ModalitàCosa selezionaIdeale per
Bilanciata (predefinita)Grandi aree di colore più accenti distinti, valutati in base alla quota di pixel e alla distanza dai colori già sceltiFoto, illustrazioni e immagini di brand
DominanteI colori che coprono più pixelMisurare quali colori riempiono un'immagine
VivaceIl punteggio della modalità Bilanciata ponderato per la croma, così gli accenti saturi salgono in classificaMoodboard, foto di prodotto e opere d'arte

L'impostazione Pixel esatto restituisce un colore presente nell'immagine. L'impostazione Media restituisce il colore medio di ogni gruppo. Il cursore Unisci simili stabilisce quanto devono essere vicini due colori per contare come uno solo, misurato come distanza ΔE_OK (0.03 di default).

Quanto sono precisi i colori estratti?

I colori estratti sono valori esatti dei pixel: l'estrattore campiona pixel reali senza mescolarli, quindi ogni codice HEX di una palette in modalità Pixel esatto compare nella tua immagine.

  • Raggruppamento percettivo. I colori vengono confrontati in OKLab, dove distanze uguali appaiono come differenze uguali. La distanza RGB sovrastima alcune differenze di colore e ne sottostima altre.
  • Risultati stabili. Il clustering usa un seed fisso, quindi la stessa immagine con le stesse impostazioni restituisce sempre la stessa palette.
  • Proporzioni reali. Ogni pixel viene assegnato al colore della palette più vicino, quindi le quote sommano al 100%.
  • Trasparenza rispettata. I pixel con opacità inferiore al 50% non contano, quindi un PNG trasparente mostra solo i suoi colori visibili.

La guida Come funziona l'estrazione dei colori confronta questo metodo con median cut, quantizzazione octree e k-means semplice.

Da quali fonti puoi estrarre i colori?

L'Estrattore di palette di colori legge quattro tipi di fonte, ciascuno con il proprio strumento e le proprie impostazioni.

  • Immagini

    Foto, illustrazioni, screenshot e opere d'arte. Più immagini producono un'unica palette unita in cui ogni immagine conta allo stesso modo.

  • Loghi

    L'Estrattore di colori da logo restituisce i colori esatti del logo, rimuove lo sfondo e ignora i pixel sfumati lungo i bordi.

  • Siti web

    L'Estrattore di colori da sito web legge il CSS di un sito e ne restituisce i colori del brand, del testo, dello sfondo e dei bordi a partire da un URL.

  • Singoli pixel

    Il Selettore di colore da immagine restituisce il codice HEX esatto di ogni pixel su cui clicchi, con una lente d'ingrandimento per la precisione.

Quali formati di esportazione puoi scaricare?

L'estrattore esporta una palette in 11 formati, tutti generati nel tuo browser.

FormatoFileSi apre in
Variabili CSS.cssQualsiasi foglio di stile di un sito web
Tailwind v4 e v3Blocco @theme, tailwind.config.jsProgetti Tailwind CSS
SCSS.scssProgetti Sass
Design token.tokens.jsonStrumenti W3C Design Tokens e plugin di Figma
Adobe Swatch Exchange.asePhotoshop, Illustrator e InDesign
Procreate.swatchesProcreate su iPad
Palette GIMP.gplGIMP, Inkscape e Krita
SVG.svgFigma, Sketch e Illustrator
Scheda palette PNG.pngPresentazioni, moodboard e post social
Elenco HEX.txtQualsiasi app

I formati di codice possono includere una scala di varianti chiare e scure da 50 a 950 per ogni colore, costruita in OKLCH attorno al valore estratto.

Chi usa un estrattore di palette di colori?

  • Designer

    Ricava una palette da una foto di moodboard o da un'immagine di riferimento e inviala a Figma, alle app Adobe o a Procreate come campioni.

  • Sviluppatori

    Trasforma lo screenshot di un design in variabili CSS o in un tema Tailwind con una scala completa di varianti chiare e scure.

  • Titolari di attività

    Trova i codici HEX esatti di un logo o di una foto di prodotto per mantenere coerenti sito web, negozio online e post social.

  • Artisti e illustratori

    Studia le proporzioni di colore di un dipinto o di una foto prima di iniziare una nuova opera.

  • Committenti di stampa

    Raccogli i valori esatti per lo schermo e le stime CMYK per dare indicazioni alla tipografia prima di una prova di stampa.

  • Revisori dell'accessibilità

    Verifica ogni coppia di colori di una palette rispetto alle soglie WCAG 2. La guida Contrasto WCAG in una palette spiega le regole.

Le tue immagini vengono caricate?

No. Le immagini vengono decodificate e analizzate nel tuo browser, e i file non raggiungono mai un server. Il sito non memorizza immagini né palette.

Due funzioni contattano il server: il caricamento di un'immagine da un indirizzo web e la lettura del codice di un sito web. Entrambe recuperano il file pubblico per te e non ne conservano alcuna copia. L'informativa sulla privacy elenca ogni dato che il sito gestisce.

Domande frequenti sull'estrattore di palette di colori

L'estrattore di palette di colori è gratuito?

Sì. Ogni funzione e ogni formato di esportazione sono gratuiti, senza account, filigrana o limiti di utilizzo.

Quanti colori può avere una palette?

Una palette contiene da 2 a 20 colori, impostati con il cursore Colori. La palette predefinita ha 6 colori.

Perché un altro strumento mi dà colori diversi?

Gli strumenti differiscono per spazio colore, algoritmo di clustering, campionamento e valore del campione. Questo estrattore raggruppa i colori in OKLab e restituisce di default valori reali dei pixel, mentre molti strumenti fanno la media dei colori in RGB.

Posso estrarre una palette da più immagini?

Sì. Aggiungi fino a 20 immagini e l'estrattore crea un'unica palette unita in cui ogni immagine ha lo stesso peso, più una piccola palette per ogni immagine.

L'estrattore funziona sugli smartphone?

Sì. L'estrattore funziona nei browser mobili, accetta foto dal rullino e preleva i colori con un tocco.

Quali formati di immagine sono supportati?

I file JPG, PNG, WebP, GIF, AVIF, BMP e SVG funzionano in tutti i browser attuali. Le foto HEIC si aprono solo in Safari, quindi gli altri browser richiedono una copia JPG o PNG.