Generatore Gradienti CSS
Crea gradienti CSS con anteprima live e copia il codice
CSS Gradient Generator Online — Anteprima Live
Crea gradienti CSS professionali con anteprima in tempo reale. Supporta gradienti lineari (linear-gradient), radiali (radial-gradient) e conici (conic-gradient). Personalizza colori, posizioni e angoli, poi copia il codice CSS pronto all'uso direttamente nel tuo progetto.
background: linear-gradient(90deg, #6366f1 0%, #ec4899 100%);
Come funziona
- Scegli il tipo di gradiente: lineare, radiale o conico
- Per i gradienti lineari e conici, imposta l'angolo di rotazione
- Aggiungi i color stop con il color picker e imposta la posizione percentuale
- L'anteprima si aggiorna in tempo reale mentre modifichi i valori
- Copia il codice CSS generato e incollalo nel tuo foglio di stile
Domande Frequenti
Qual è la differenza tra linear-gradient e radial-gradient?
linear-gradient crea una transizione di colori lungo una linea retta (definita dall'angolo). radial-gradient irradia i colori da un punto centrale verso l'esterno in forma circolare o ellittica.
Cos'è un color stop?
Un color stop è un punto nel gradiente dove inizia o termina un colore specifico. La posizione è espressa in percentuale (0% = inizio, 100% = fine). Puoi aggiungere quanti stop vuoi per creare gradienti complessi.
Il codice CSS generato funziona su tutti i browser?
Sì, i gradienti CSS sono supportati da tutti i browser moderni (Chrome, Firefox, Safari, Edge). Per browser molto vecchi potrebbe essere necessario usare prefissi vendor (-webkit-), ma in generale non è più necessario.