Outils/Code & Développeur/Générateur de Dégradés CSS

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

Générez du code de dégradé CSS.

100% sur l'appareil · 0 téléversement

Couleur 1

Couleur 2

Type de dégradé

Angle: 90°

background: linear-gradient(90deg, #4f46e5 0%, #ec4899 100%);

01 · Illimité

Utilisez l'outil autant que vous voulez — entièrement gratuit.

02 · Privé

Vos fichiers ne quittent jamais votre appareil ; tout fonctionne dans le navigateur.

03 · Rapide

Le traitement est local et se termine en quelques secondes.

Comment créer des dégradés CSS

Choisissez vos couleurs

Sélectionnez deux couleurs ou plus avec les sélecteurs visuels.

Ajustez type et angle

Passez de linéaire à radial, tournez la direction, repositionnez les arrêts.

Copiez le code CSS

Récupérez la propriété background prête et collez-la dans votre feuille de style.

Pourquoi ce générateur de dégradés ?

✓Édition visuelle avec aperçu en direct

✓Linéaire et radial avec contrôle total de l'angle

✓Sortie CSS propre à copier-coller

✓Gratuit, instantané, sans inscription

Questions fréquentes

Quels types de dégradés sont pris en charge ?+

Les dégradés linéaires sous tout angle et radiaux depuis un point central — les deux chevaux de trait qui couvrent pratiquement tout le design d'interface.

Le CSS généré est-il compatible partout ?+

Oui — la syntaxe standard linear-gradient() et radial-gradient() est prise en charge par tous les navigateurs depuis des années, sans préfixes.

Comment rendre les dégradés professionnels ?+

Gardez des teintes voisines proches (bleu vers violet, pas bleu vers orange), évitez les extrémités noir/blanc purs et préférez un angle subtil comme 135° au vertical strict.

Puis-je utiliser plus de deux couleurs ?+

Oui — ajoutez plusieurs arrêts de couleur pour des transitions multicolores façon lever de soleil. L'aperçu se met à jour en direct.