À propos de cet outil
Les dégradés CSS sont partout — arrière-plans hero, boutons, cartes — mais écrire la syntaxe à la main et deviner les angles est pénible. Ce constructeur visuel vous laisse ajouter et faire glisser des arrêts de couleur, régler l’angle et basculer entre dégradés linéaires, radiaux et coniques tout en voyant le résultat remplir un aperçu en direct.
Quand cela vous convient, copiez le CSS de background prêt à l’emploi directement dans votre feuille de style. Tout est côté client : expérimentez autant que vous voulez — rien n’est envoyé.
Questions fréquentes
Ce générateur ajoute-t-il des préfixes propriétaires comme -webkit-linear-gradient ?
Non. La syntaxe avec préfixes n'est nécessaire que pour de très vieux navigateurs (avant 2012), donc l'outil génère un linear-gradient(), radial-gradient() et conic-gradient() standard, compris par tous les navigateurs actuels.
Mon dégradé est-il envoyé ou enregistré quelque part ?
Non. Tout — les points de couleur, l'angle et l'aperçu — est généré en direct dans votre navigateur ; rien n'est envoyé à un serveur.
Quelle est la différence entre un dégradé linéaire, radial et conique ?
Le linéaire fait passer les couleurs le long d'une ligne droite selon un angle choisi, le radial s'étend en cercles vers l'extérieur depuis un point central, et le conique fait tourner les couleurs autour d'un point central comme une roue chromatique.
Combien de points de couleur puis-je ajouter ?
Autant que nécessaire — cliquez sur 'Add' pour insérer un autre point, faites glisser son curseur de position, et supprimez n'importe quel point sauf les deux derniers.
Puis-je coller le CSS généré directement dans ma feuille de style ?
Oui. Cliquez sur Copier et collez la ligne `background: ...;` directement dans n'importe quelle règle CSS ou style en ligne — aucune modification nécessaire.