Migliore gratis Generatore di gradienti CSS
Costruire gradienti CSS lineari e radiali con anteprima dal vivo
100% esenzione
Nessun segno
Nessuna filigrana
✨
Go Pro per i migliori modelli AI - immagine, video e chat - più maggiori upload, priorità nella coda e nessuna attesa.
Aggiorna a Pro
Amore Best.Free? Condividilo
Come funziona
- Scegli un tipo. Scegliere lineare o radiale e impostare l'angolo per un gradiente lineare.
- Scegli colori e fermate. Imposta due o più colori e le loro posizioni; aggiungi una terza fermata nelle opzioni Avanzate.
- Copia il CSS. Premi Copia CSS e incolla il gradiente di sfondo nel foglio di stile.
Informazioni su questo strumento
Costruisci un gradiente CSS per occhio invece di modificare i valori ciechi. Passa tra lineare e radiale, trascina l'angolo per un gradiente lineare e scegli colori e posizioni per almeno due fermate mentre una barra di anteprima a tutta larghezza viene aggiornata in diretta. Copia la proprietà di sfondo risultante direttamente nel foglio di stile. Le opzioni avanzate aggiungono un terzo arresto colore per miscele più ricche e permettono di scegliere un cerchio o forma di ellissi per gradienti radiali. Tutto gira nel browser.
Per cosa la gente lo usa
- Progetta un gradiente di sfondo eroe o sezione
- Crea un pulsante o un riempimento gradiente della carta
- Miscelare due o tre colori di marca senza intoppi
- Generare un faro radiale o un effetto vignetta
Domande frequenti
Un gradiente lineare si fonde lungo una linea retta all'angolo che si sceglie; un gradiente radiale si fonde verso l'esterno da un punto centrale come cerchio o ellisse.
Per un gradiente lineare l'angolo imposta la direzione della miscela
Ogni stop è un colore posto ad una percentuale lungo il gradiente. Spostando un stop cambia dove quel colore si trova e quanto è tagliente la miscela.
Sì. Apri Opzioni avanzate per aggiungere un terzo blocco colore, inserito tra il primo e l'ultimo per una miscela multicolore.
No. I colori e le fermate vengono trasformati in una stringa CSS localmente nel browser.
Completamente gratuito, nessun account e nessun limite
Sì. E funziona nel browser, così CSS Gradient Generator funziona su telefoni e tablet così come desktop Hoppenstedt non c'è alcuna applicazione da installare.
Di solito solo pochi secondi per un tipico file CSS Gradient Generator inizia a funzionare nel momento in cui gli dia il vostro input.
L'uso casuale è illimitato, sotto un generoso tappo di uso equo che lo mantiene veloce per tutti.
Tutti i browser moderni Chrome, Safari, Firefox e Edge. CSS Gradient Generator non ha bisogno di nulla installato oltre il browser che già si utilizza.