Chromatica Tools · Colori · Contrasti · Accessibilità

Generatore di gradienti CSS

Crea sfumature lineari, radiali o coniche con da 2 a 8 colori, regola l'angolo e la posizione di ogni colore e copia il codice CSS pronto da usare nei tuoi progetti.

Come si usa

  1. Scegli il tipo di gradiente: lineare, radiale o conico.
  2. Imposta l'angolo e modifica colore e posizione di ogni punto; puoi aggiungere fino a 8 colori.
  3. Guarda l'anteprima in tempo reale.
  4. Copia il codice CSS oppure esporta i colori in CSS, JSON o HTML.

Domande frequenti

Che differenza c'è tra gradiente lineare, radiale e conico?

Nel gradiente lineare i colori scorrono lungo una direzione. Nel radiale si espandono dal centro verso l'esterno. Nel conico ruotano attorno al centro, come le fette di una torta.

Quanti colori posso usare?

Da 2 a 8, ciascuno con una propria posizione in percentuale.

Come uso il codice generato?

Incolla la riga `background: ...;` nel CSS dell'elemento che vuoi colorare: il browser la applica direttamente, senza immagini.

Altri strumenti di Chromatica Tools