Générateur Dégradé CSS
Créez des dégradés linéaires et radiaux CSS.
Points de couleur
Orientation
Sortie CSS
Préréglages rapides
Outils recommandés
Utilitaires sélectionnés qui pourraient vous être utiles
Travailler avec les Dégradés CSS
Aperçu
Pour sortir des fonds unis, les dégradés CSS sont le moyen le plus simple. Trois types (`linear-gradient`, `radial-gradient`, `conic-gradient`), chacun produisant des effets distincts. Ce générateur édite visuellement positions de stops, angle et forme, avec aperçu en temps réel. Supporte multiples stops, transparence et motifs répétés.
Comment ça marche
Ajoutez/déplacez/supprimez des stops de couleur avec des sliders. Angle 0-360°, pour radial choisissez le centre. Le CSS généré inclut fallbacks pour anciens navigateurs. Prêt à coller.
Quand l'utiliser
Fonds de sections hero. Effets 3D sur boutons. Profondeur subtile sur cards. Placeholders d'avatar (gradient conique arc-en-ciel). Animations shimmer de loading. Expression douce des couleurs de marque.
Questions Fréquentes
Les gradients CSS sont bien plus légers que des images (octets vs centaines de KB). Attention à la charge GPU seulement en animation.