Créez de superbes dégradés de texte CSS sans effort

Transformez votre code CSS en LESS avec des variables, l’imbrication,

Contrôles de dégradé CSS

Dégradé de texte
.gradient-text { background: linear-gradient(to right, #4F46E5, #EC4899); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }

Dégradés

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)
Salade
linear-gradient(to right, #FA709A, #FEE140)
Neon Glow
linear-gradient(to right, #00DBDE, #FC00FF)

de fruits Comment utiliser

1

Entrez votre texte

Tapez le texte auquel vous souhaitez appliquer le dégradé dans le " Texte".

2

Choisissez le type

dégradé Choisissez entre les types de dégradé Linéaire, Radial ou Conique.

3

Ajuster la direction ou l’angle

Pour les dégradés linéaires, choisissez une direction. Pour les dégradés coniques, définissez l’angle.

4

Personnalisez les couleurs

Ajoutez, supprimez ou ajustez les arrêts de couleur et leurs positions pour créer le dégradé souhaité.

5

Copiez ou enregistrez

le code CSS généré ou enregistrez-le en tant que fichier CSS à utiliser dans vos projets.

À propos des dégradés de texte Les

dégradés de texte CSS vous permettent d’appliquer de magnifiques dégradés multicolores directement au texte. Cet effet n’était autrefois possible qu’avec des images, mais le CSS moderne le rend simple et efficace.

Prise en charge des navigateurs :Les dégradés de texte sont pris en charge dans tous les navigateurs modernes, y compris Chrome, Firefox, Safari et Edge. Pour les navigateurs plus anciens comme Internet Explorer, le texte redeviendra uni.

Conseils d’utilisation :dégradés de texte fonctionnent mieux avec du texte en gras et des combinaisons de couleurs à contraste élevé. Expérimentez différents types et directions de dégradé pour obtenir l’effet souhaité.

Related Tools