Générateur de Dégradé CSS

Créez des dégradés CSS linéaires et radiaux visuellement. Prévisualisation en direct, copiez le code CSS en un clic.

Type
90°

Points de couleur

Code CSS

Comment utiliser le générateur de dégradé CSS

  1. Choisissez le type Linéaire ou Radial.
  2. Pour un dégradé linéaire, faites glisser le curseur Direction pour régler l'angle.
  3. Choisissez les couleurs pour chaque point. Cliquez sur + Ajouter un point pour en ajouter. La prévisualisation et le CSS se mettent à jour instantanément.
  4. Cliquez sur Copier pour copier la propriété CSS background prête à l'emploi.

Syntaxe des dégradés CSS

Les dégradés linéaires utilisent linear-gradient(angle, couleur1, couleur2, ...). L'angle peut être en degrés (90deg) ou en mot-clé (to right). Les dégradés radiaux utilisent radial-gradient(forme, couleur1, couleur2, ...). Les deux acceptent un nombre quelconque de points de couleur, avec des positions optionnelles (ex. red 20%, blue 80%).