Generatore Gradienti CSS
Generatore sfumature CSS gratuito online, anteprima in tempo reale
Tipi di gradiente CSS
I gradienti lineari transizionano i colori lungo una linea retta definita da un angolo o direzione. I gradienti radiali transizionano da un punto centrale verso l'esterno in forma circolare o ellittica. Entrambi supportano color stop multipli per transizioni complesse tra tre o più colori.
Come creare un gradiente CSS
Seleziona il tipo di gradiente (lineare o radiale), scegli i colori di inizio e fine e regola l'angolo per i gradienti lineari. Il tool genera il codice CSS istantaneamente. Copia il CSS e incollalo nel tuo foglio di stile come proprietà background o background-image.
▶Posso usare più di due colori in un gradiente?
Sì, i gradienti CSS supportano color stop illimitati. Aggiungi colori aggiuntivi modificando il codice CSS generato con valori di colore extra separati da virgole.
▶Qual è il supporto browser per i gradienti CSS?
I gradienti CSS sono supportati in tutti i browser moderni. Per browser più vecchi, potresti aver bisogno di prefissi vendor (-webkit-gradient) o un colore di fallback solido.
▶Posso usare trasparenza nei gradienti?
Sì. Usa valori colore rgba() o hsla() per includere la trasparenza. Ad esempio, linear-gradient(135deg, rgba(255,0,0,0.5), transparent) crea un gradiente rosso semi-trasparente.
Se questo strumento ti è stato utile, offri un caffè all'autore.
Offri un caffè