Crea un bellissimo gradiente di testo CSS senza sforzo

Crea straordinari effetti di testo sfumati per il tuo sito web

Controlli della sfumatura

Testo sfumato CSS
.gradient-text { background: linear-gradient(to right, #4F46E5, #EC4899); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }

Gradienti popolari

Sunset
linear-gradient(to right, #FF512F, #F09819)
Magic
linear-gradient(to right, #4158D0, #C850C0, #FFCC70)
Ocean
linear-gradient(to right, #0093E9, #80D0C7)
Electric
linear-gradient(to right, #30CFD0, #330867)
Macedonia
linear-gradient(to right, #FA709A, #FEE140)
Neon Glow
linear-gradient(to right, #00DBDE, #FC00FF)

Come si usa

1

Inserisci il tuo testo

Digita il testo a cui desideri applicare la sfumatura nel campo di immissione "Testo".

2

Scegli il tipo di sfumatura

Selezionate tra i tipi di sfumatura Lineare, Radiale o Conico.

3

Regola la direzione o l'angolo

Per le sfumature lineari, scegliete una direzione. Per le sfumature coniche, impostare l'angolo.

4

Personalizza i colori

Aggiungi, rimuovi o regola le interruzioni di colore e le loro posizioni per creare la sfumatura desiderata.

5

Copia o salva CSS

Copia il codice CSS generato o salvalo come file CSS da utilizzare nei tuoi progetti.

Informazioni sulle sfumature di testo

Le sfumature di testo CSS consentono di applicare bellissime sfumature multicolori direttamente al testo. Un tempo questo effetto era possibile solo con le immagini, ma i moderni CSS lo rendono semplice ed efficiente.

Supporto browser:Le sfumature di testo sono supportate in tutti i browser moderni, inclusi Chrome, Firefox, Safari ed Edge. Per i browser meno recenti come Internet Explorer, il testo tornerà a un colore a tinta unita.

Suggerimenti per l'uso:Le sfumature di testo funzionano meglio con il testo in grassetto e le combinazioni di colori ad alto contrasto. Sperimenta diversi tipi di gradiente e direzioni per ottenere l'effetto desiderato.

Related Tools