Estrattore colori da immagine
Estrai i colori dominanti dalle immagini localmente nel browser.
Cosa copre questa pagina
Questa pagina spiega il flusso di lavoro e collega direttamente alla sezione corretta dello strumento principale Chromoforge.
- Genera palette da un colore base.
- Controlla il contrasto prima di pubblicare testo UI.
- Esporta CSS, Tailwind, SCSS, JSON, SVG e PNG.
- Funziona localmente nel browser.
Come funziona l'estrazione colori da immagine
Caricare un'immagine nel browser e ottenere i colori dominanti è interamente client-side: nessun upload su server, nessuna API esterna. La tua immagine non lascia mai il tuo dispositivo.
L'algoritmo ridimensiona l'immagine, ne campiona i pixel con la Canvas API del browser e poi raggruppa i colori simili con k-means nello spazio RGB. Il risultato sono sei colori — la media di ciascun gruppo — ordinati per dominanza, cioè per quanti pixel campionati copre ogni gruppo.
I colori estratti non sono sempre i più belli o utili direttamente: un'immagine fotografica avrà spesso grigi neutri tra i dominanti, perché sono davvero le tinte che coprono più superficie. Lo strumento non applica nessun filtro sui neutri: restituisce i sei gruppi più estesi così come sono, e sta a te scegliere quale usare come base.
Dopo l'estrazione clicca un colore per impostarlo come base della palette: da lì gli altri strumenti di Chromoforge generano scale complete, verificano il contrasto o creano gradienti.
Esempi pratici
- Brand da fotografia: il cliente ti dà una foto di prodotto come riferimento cromatico. Estrai i colori dominanti e usali come punto di partenza per la palette UI.
- Matching UI-immagine: hai un hero con una foto e vuoi che i bottoni e i testi abbiano colori coerenti con essa. Estrai i dominanti, scegli il più saturo come accent.
- Analisi competitor: carica lo screenshot del sito di un competitor per capire rapidamente la loro palette senza dover usare un color picker manuale su ogni elemento.
- Artwork e illustrazioni: estrai la palette da un'illustrazione per creare materiali correlati (slide, social, brochure) con la stessa armonia cromatica.
FAQ — Estrattore colori immagine
Quali formati immagine sono supportati?
PNG, JPEG e WebP, fino a 8 MB per file. Gli altri formati — GIF, AVIF, SVG e i RAW come CR2, NEF o ARW — vengono rifiutati con un messaggio di errore: convertili prima in uno dei tre formati supportati.
La mia immagine viene inviata a un server?
No. L'elaborazione avviene interamente nel browser tramite Canvas API. Il file viene letto in memoria locale, campionato e poi scartato. Non c'è nessun upload, nessuna connessione di rete per l'elaborazione dell'immagine.
Perché i colori estratti non corrispondono a quelli che mi aspettavo?
Il clustering raggruppa pixel simili, quindi un gradiente sarà rappresentato da uno o pochi colori medi. Fotografie con molte ombre e luci producono spesso grigi come dominanti anche se contengono colori vivaci: sono davvero i toni più diffusi. Se ti serve la tinta accesa e non il grigio, ritaglia l'immagine sulla zona che ti interessa e riprova.