Générateur de Dégradé CSS
Générateur de dégradés CSS gratuit en ligne, aperçu en temps réel
Types de dégradés CSS
Les dégradés linéaires transitent les couleurs le long d'une ligne droite définie par un angle ou une direction. Les dégradés radiaux transitent d'un point central vers l'extérieur en forme circulaire ou elliptique. Les deux prennent en charge plusieurs points de couleur pour des transitions complexes entre trois couleurs ou plus.
Comment créer un dégradé CSS
Sélectionnez le type de dégradé (linéaire ou radial), choisissez les couleurs de début et de fin, et ajustez l'angle pour les dégradés linéaires. L'outil génère le code CSS instantanément. Copiez le CSS et collez-le dans votre feuille de style comme propriété background ou background-image.
▶Puis-je utiliser plus de deux couleurs dans un dégradé ?
Oui, les dégradés CSS prennent en charge un nombre illimité de points de couleur. Ajoutez des couleurs supplémentaires en modifiant le code CSS généré avec des valeurs de couleur supplémentaires séparées par des virgules.
▶Quelle est la prise en charge des navigateurs pour les dégradés CSS ?
Les dégradés CSS sont pris en charge par tous les navigateurs modernes. Pour les navigateurs plus anciens, vous pouvez avoir besoin de préfixes vendeur (-webkit-gradient) ou d'une couleur de repli unie.
▶Puis-je utiliser la transparence dans les dégradés ?
Oui. Utilisez des valeurs de couleur rgba() ou hsla() pour inclure la transparence. Par exemple, linear-gradient(135deg, rgba(255,0,0,0.5), transparent) crée un dégradé rouge semi-transparent.