Generatore Gradienti CSS
Progetta gradienti lineari e radiali visivamente, poi copia il CSS pronto all'uso. Tutto si aggiorna in tempo reale nel tuo browser.
Come creare un gradiente CSS
- Scegli lineare o radiale, poi imposta l'angolo per un gradiente lineare.
- Scegli i colori per le tue tappe e imposta ogni posizione da 0 a 100.
- Aggiungi o rimuovi tappe per modellare la transizione come preferisci.
- Copia il CSS generato nel tuo foglio di stile o attributo style.
Domande Frequenti
Cos'è un gradiente lineare?
Un gradiente lineare fonde i colori lungo una linea retta all'angolo che scegli, da 0 a 360 gradi.
Cos'è un gradiente radiale?
Un gradiente radiale fonde i colori verso l'esterno da un punto centrale in forma circolare o ellittica.
Cosa significano i numeri di posizione?
Ogni posizione è una percentuale lungo il gradiente, da 0% all'inizio a 100% alla fine. Le tappe vengono ordinate per posizione automaticamente.
Il gradiente funziona in tutti i browser?
Sì. Il CSS generato usa le funzioni standard linear-gradient e radial-gradient supportate da ogni browser moderno.
Strumenti Correlati
Perché usare un generatore di gradienti?
Usa il generatore di gradienti CSS per progettare transizioni di colore fluide visivamente invece di indovinare i valori nel codice, e copia CSS pronto per la produzione all'istante.
- Vedi il gradiente cambiare in tempo reale mentre regoli colori, angoli e tappe.
- Copia CSS esatto e valido senza cercare errori di sintassi.
- Crea sfondi con più tappe per pulsanti, banner e sezioni in pochi secondi.
Consigli e Limiti
Puoi aggiungere tutte le tappe di colore che vuoi, e il generatore ne mantiene almeno due così il gradiente è sempre valido. Le tappe vengono ordinate per posizione prima di generare il CSS.