Générateur de Dégradés

Créez de beaux dégradés CSS visuellement. Choisissez linéaire ou radial, ajoutez des arrêts de couleur, ajustez l'angle, aperçu et copiez le CSS.

Position: 0%
Position: 100%
background: linear-gradient(90deg, #667eea 0%, #764ba2 100%);
background: -webkit-linear-gradient(90deg, #667eea 0%, #764ba2 100%);
background: -moz-linear-gradient(90deg, #667eea 0%, #764ba2 100%);
background: -o-linear-gradient(90deg, #667eea 0%, #764ba2 100%);
background: linear-gradient(90deg, #667eea 0%, #764ba2 100%);

Générateur de Dégradés CSS : Créez de Beaux Dégradés Instantanément

Les dégradés CSS permettent d'afficher des transitions fluides entre deux couleurs ou plus sans fichiers image. Ils réduisent les requêtes HTTP, s'adaptent parfaitement à toute résolution et peuvent être modifiés avec une seule ligne de code. Notre générateur facilite la création de ces effets avec une interface visuelle et un aperçu en temps réel.

L'outil supporte les dégradés linéaires et radiaux. Les linéaires transitionnent les couleurs le long d'une ligne droite définie par un angle, tandis que les radiaux propagent les couleurs vers l'extérieur depuis un point central. Vous pouvez ajouter jusqu'à huit arrêts de couleur et ajuster l'angle de 0 à 360 degrés.

Une fois satisfait de l'aperçu, l'outil génère du code CSS propre prêt à coller dans votre feuille de style. Il fournit également des versions avec préfixes fournisseur pour une compatibilité maximale, incluant -webkit-, -moz- et -o-.

Les designers et développeurs utilisent couramment des fonds dégradés pour les sections hero, boutons, overlays de cartes et barres de navigation. En combinant plusieurs arrêts de couleur, vous pouvez créer des mélanges complexes qui ajoutent de la profondeur à toute page web.

FAQ

Partager

Soutenez ce projet

Si vous trouvez nos outils utiles, offrez-nous un café !

Buy Me a Coffee

Outils les plus populaires