Che cos’è una palette di colori?
Una palette di colori è il piccolo insieme di tonalità che definisce l’aspetto di un’immagine o di un marchio. Estrarre la palette da una foto ti permette di riutilizzare esattamente quei colori in un progetto grafico, un sito, una presentazione o l’arredamento di una stanza, per un risultato coerente e armonioso.
Grafici, sviluppatori web, creatori di contenuti e chiunque voglia abbinare i colori con sicurezza usano strumenti come questo ogni giorno: per costruire l’identità di un progetto partendo da una foto che li ispira, per adattare un sito ai colori di un logo o semplicemente per scoprire il codice di un colore preciso.
Come estrarre i colori da un’immagine
- Aggiungi l’immagine trascinandola nell’area qui sopra, scegliendola o incollandola con Ctrl+V.
- Guarda la palette: compaiono i colori dominanti, ordinati in base a quanta parte dell’immagine occupano.
- Regola il numero di colori con il cursore, tra 3 e 12.
- Fai clic su un colore per copiarne il codice HEX. Puoi anche copiare l’intera palette, copiarla come variabili CSS o scaricarla come immagine PNG.
- Usa il contagocce: fai clic in qualsiasi punto dell’immagine per ottenere il colore esatto di quel pixel.
Come vengono calcolati i colori
Pasafoto analizza i pixel dell’immagine e applica l’algoritmo di taglio mediano (median cut), la stessa idea che molti programmi di fotoritocco usano per ridurre i colori. Raggruppa le tonalità simili e fa la media di ogni gruppo, così la palette riflette i colori realmente presenti nella foto e quanto spazio occupa ciascuno. Le aree trasparenti vengono ignorate, quindi funziona bene con i loghi in PNG.
HEX, RGB e CSS
- HEX (#1E40AF): il formato più usato nel web design e in strumenti come Figma o Canva.
- RGB (rgb(30, 64, 175)): la quantità di rosso, verde e blu, da 0 a 255.
- Variabili CSS: il pulsante «Copia CSS» genera un blocco
:rootpronto da incollare nel tuo foglio di stile.
Privato e gratis
L’immagine viene analizzata nel tuo browser e non viene mai caricata su un server. Puoi usarlo in tutta tranquillità con progetti riservati, foto personali o materiale dei clienti.
Idee per usare la tua palette
Una regola classica del design è il 60-30-10: un colore dominante per il 60% della superficie (sfondi), uno secondario per il 30% (blocchi, schede) e uno di accento per il 10% (pulsanti, link). Estrai 5 o 6 colori da una foto che ti ispira e distribuisci i ruoli così. Controlla anche il contrasto tra testo e sfondo perché tutto resti leggibile: i colori molto chiari funzionano come sfondo e quelli scuri come testo. Se parti da un logo, estrai solo 3 o 4 colori per ottenere i colori esatti del marchio.
Domande frequenti
Come ottengo il codice colore di un’immagine?
Aggiungi l’immagine e fai clic sul punto che ti interessa: il contagocce ti dà il codice HEX e RGB e lo copia negli appunti.
Quanti colori posso estrarre?
Tra 3 e 12. Sposta il cursore e la palette viene ricalcolata all’istante.
Cosa significa la percentuale di ogni colore?
È approssimativamente la parte dell’immagine occupata da quel gruppo di colori.
Posso usare la palette in Canva, Figma o CSS?
Sì. Copia i codici HEX per Canva o Figma, oppure usa «Copia CSS» per avere variabili pronte per il tuo sito.
Funziona con i loghi trasparenti?
Sì, i pixel trasparenti vengono ignorati e si analizzano solo i colori visibili.
La mia immagine viene caricata su Internet?
No. L’analisi avviene nel tuo browser e l’immagine non lascia mai il tuo dispositivo.