Scegli un colore, copia il codice, vai avanti
Selettore di colore, generatore di gradienti e contagocce per immagini in un'unica pagina. Senza account, senza installazione e senza attese: scegli un tono e copialo come HEX, RGB, HSL o HSV.
Codici colore
#0F37FFrgb(15, 55, 255)hsl(230°, 100%, 52.94%)hsv(230°, 94.12%, 100%)cmyk(94.12%, 78.43%, 0%, 0%)xyz(19.61, 10.05, 95.5)lab(37.93, 62.96, -98.45)lch(37.93, 116.86, 302.6°)Colori di tendenza
Vedi tutti i colori di tendenzaCosa contiene
Contagocce
Preleva colori da un'immagine caricata, o da qualsiasi cosa a schermo dove il browser lo consente. Trascina un file e clicca un pixel.
Conversione di formati
Passa all'istante tra HEX, RGB, HSL, HSV, CMYK, XYZ, LAB e LCH, e copia il valore direttamente nel CSS o nel tuo strumento di design.
Generatore di gradienti
Aggiungi e trascina gli stop sulla barra, alterna lineare e radiale, regola angolo e opacità, poi copia il CSS finito.
Cronologia colori
Ogni colore e gradiente resta nel tuo browser, così puoi tornarci più tardi o riusarlo in un altro progetto.
Armonie e variazioni
Ogni pagina colore mostra tinte, ombre e sei schemi di armonia, e trasforma ognuno in un gradiente con un clic.
Gratuito e privato
Nessun paywall e nessun tracciamento di ciò che scegli. Le immagini caricate vengono lette nel browser e non vanno da nessuna parte.
A chi serve
- Designer e team di prodotto
- Per abbozzare un'interfaccia o una palette di marca, esplorare combinazioni e copiare il CSS esatto di un gradiente.
- Illustrazione e arte
- Per prelevare da fotografie e dipinti con il contagocce e pianificare sfumature morbide.
- Sviluppo front-end
- Per produrre valori coerenti in un progetto e rileggere quelli di un design esistente.
- Verifiche di accessibilità
- Per confrontare un colore tra modelli e regolarlo finché il rapporto di contrasto supera la soglia richiesta.
Come si usa
- 1
Scegli un colore
Clicca nel campo di saturazione, poi rifinisci con i cursori di tonalità e alfa. HEX, RGB e HSV si aggiornano man mano.
- 2
Preleva da un'immagine
Trascina un'immagine sulla pagina o scegli un file, poi clicca il pixel che vuoi. I codici compaiono subito.
- 3
Costruisci un gradiente
Clicca sulla barra per aggiungere uno stop e trascinalo in posizione. Alterna lineare e radiale, poi imposta l'angolo.
- 4
Copia e riusa
Copia il valore o la dichiarazione CSS completa. Tutto ciò che scegli viene salvato automaticamente.
Domande frequenti
Uno strumento piccolo che non intralcia
È nato come utility interna: volevamo prendere un colore, aggiustarlo e proseguire, senza aprire prima un pesante programma di design. È volutamente una pagina sola, volutamente veloce, e resterà gratuito.
Estensioni per browser
Preferisci prelevare i colori direttamente dalle pagine che visiti? Le estensioni per Chrome ed Edge aggiungono un contagocce alla barra, tengono una cronologia propria e aprono questo strumento con un clic.