Couleurs & Design

Générateur de dégradés CSS

Créez des dégradés linéaires ou radiaux CSS visuellement, avec plusieurs couleurs et angles, et copiez le code généré.

Code CSS

À propos de cet outil

Ce générateur de dégradés CSS vous permet de composer visuellement un dégradé linéaire ou radial à plusieurs couleurs, d'ajuster l'angle et les points d'arrêt, puis de copier directement le code CSS correspondant.

Comment utiliser cet outil

  1. Choisissez le type de dégradé : linéaire ou radial.
  2. Ajoutez, supprimez ou déplacez les points de couleur.
  3. Ajustez l'angle (dégradé linéaire) ou la position (dégradé radial).
  4. Copiez le code CSS généré dans la zone de résultat.

Questions fréquentes

Comment créer un dégradé CSS à plusieurs couleurs ?

Ajoutez des points de couleur avec le bouton « + » : chaque point devient une étape du dégradé, avec sa propre couleur et sa position en pourcentage.

Quelle est la différence entre linear-gradient et radial-gradient ?

linear-gradient étale les couleurs le long d'une direction définie par un angle, tandis que radial-gradient les diffuse depuis un point central vers l'extérieur.

Comment changer l'angle du dégradé ?

Utilisez le curseur d'angle ou saisissez une valeur en degrés : l'aperçu et le code CSS se mettent à jour instantanément.

Le code généré fonctionne-t-il sur tous les navigateurs modernes ?

Oui, la syntaxe linear-gradient() et radial-gradient() générée est standard et supportée par tous les navigateurs récents.

Voir aussi