Generatore di Gradienti CSS
Genera gradienti CSS visivamente con anteprima dal vivo. Supporta linear, radial e conic gradient. Aggiungi color stop e copia il codice CSS. Gratuito, 100% nel browser.
Riferimento
Cosa sono i gradienti CSS?
I gradienti CSS sono immagini che mostrano una transizione fluida tra due o più colori. Vengono usati nella proprietà background-image e sono disponibili in tre tipi: lineare (in linea retta), radiale (dal centro verso l'esterno) e conico (attorno a un punto centrale). Essendo basati su vettori, appaiono nitidi a qualsiasi risoluzione.
Tipi di gradiente
linear-gradient — transizione di colore in una direzione lineare. Controllato da angolo o parole chiave di direzione. radial-gradient — transizione di colore dal centro verso l'esterno in forma radiale. conic-gradient — transizione di colore attorno a un punto centrale in forma conica. Utile per grafici a torta.
Color stop
I color stop definiscono dove i colori vengono posizionati nel gradiente. Ogni stop è composto da un colore e una posizione percentuale opzionale. Più stop si aggiungono, più complesso diventa il gradiente. I colori tra gli stop vengono interpolati automaticamente.
Privacy
Tutta la generazione dei gradienti avviene al 100% nel tuo browser. Nessun dato viene inviato a server.