Come vengono scelti i colori estratti?

I pixel di colore simile vengono raggruppati, si selezionano i sei gruppi più frequenti e si calcola il colore medio reale all'interno di ciascun gruppo, per ottenere la rappresentazione più accurata possibile.

Posso usare subito il risultato nel mio progetto?

Sì — il pulsante "Copia tutto come variabili CSS" copia ogni colore già formattato in :root { --palette-color-1: ...; }, pronto da incollare direttamente nel tuo file CSS.

Estrattore di palette colori

Questo strumento di estrazione palette colori analizza qualsiasi immagine caricata ed estrae automaticamente i colori più dominanti, mostrando per ciascuno il codice HEX e RGB insieme alla percentuale approssimativa di presenza nell'immagine. Puoi copiare ogni colore con un clic, oppure copiare l'intera palette in un colpo solo come variabili CSS pronte per il tuo progetto. Utile per estrarre l'identità cromatica da una foto prodotto, un logo o un'immagine di design che ti ispira. Tutta l'analisi avviene nel tuo browser tramite Canvas, senza caricare l'immagine su alcun server.

Strumenti di design e CSS Funziona interamente nel tuo browser

La tua immagine viene elaborata interamente sul tuo dispositivo tramite Canvas e non viene mai caricata su un server.

Carica un'immagine e lo strumento estrarrà automaticamente i suoi colori più dominanti, con il codice HEX e RGB di ciascun colore, più un pulsante per copiare tutti i colori in una volta come proprietà personalizzate CSS.

Trascina un'immagine qui, oppure scegline una

JPG, PNG o WebP

Scegli un file

Domande frequenti

No — l'immagine viene analizzata interamente nel tuo browser tramite Canvas e non viene mai caricata su alcun server.

Continua con

Completamente locale

Generatore di gradiente CSS

Crea visivamente un gradiente CSS lineare o radiale e copia il codice pronto all'uso.

Strumenti di design e CSSApri strumento

Completamente locale

Verificatore di contrasto colore

Verifica se una coppia di colori testo/sfondo rispetta gli standard di contrasto per l'accessibilità WCAG.

Strumenti di design e CSSApri strumento

Completamente locale

Convertitore di codici colore

Converti qualsiasi colore tra i formati HEX, RGB e HSL con anteprima immediata

Strumenti per sviluppatoriApri strumento

Completamente locale

Generatore di armonia palette colori

Scegli un colore base e ottieni una palette di colori armoniosa (complementare, analoga, triadica, tetradica, monocromatica).

Strumenti di design e CSSApri strumento

Strumenti correlati

Completamente locale

Generatore di screenshot del codice

Incolla il codice e trasformalo in un'immagine elegante con sfondo sfumato e barra del titolo, pronta da condividere.

Strumenti di design e CSSApri strumento

Completamente locale

Simulatore di daltonismo

Scopri come appare la tua immagine a una persona daltonica (protanopia, deuteranopia, tritanopia o acromatopsia).

Strumenti di design e CSSApri strumento

Completamente locale

Generatore di clip-path CSS

Scegli una forma predefinita (cerchio, triangolo, stella, fumetto...) e copia il codice clip-path.

Strumenti di design e CSSApri strumento

Completamente locale

Generatore di curve cubic-bezier

Trascina due punti per progettare visivamente una curva di accelerazione personalizzata e copia il codice cubic-bezier.

Strumenti di design e CSSApri strumento

Completamente locale

Generatore di glassmorphism CSS

Progetta visivamente un effetto vetro smerigliato e copia il codice CSS pronto all'uso.

Strumenti di design e CSSApri strumento

Vuoi provare Uddatak?

Sfoglia la libreria completa di strumenti e inizia subito a usare ciò di cui hai bisogno — gratis, senza registrazione.

Vedi tutti gli strumenti