Générateur de dégradés

Créez des dégradés CSS avec une sortie copiable

Arrêts de couleur

CSS

À propos du générateur de dégradés CSS

Ce générateur de dégradés crée visuellement des dégradés CSS linéaires et radiaux. Choisissez votre type de dégradé, l'angle et les arrêts de couleur, puis copiez la règle CSS prête à l'emploi. Supporte plusieurs arrêts de couleur et un aperçu en temps réel pour que vous puissiez voir exactement à quoi ressemblera le dégradé avant de l'utiliser.

Les dégradés sont largement utilisés dans la conception web moderne pour les arrière-plans, les boutons, les sections héros et les superpositions sur les images. Cet outil fait gagner du temps en générant automatiquement la syntaxe CSS compatible entre navigateurs — pas besoin de mémoriser la syntaxe exacte du dégradé ou de calculer manuellement les pourcentages des arrêts de couleur.

Questions fréquemment posées

Linéaire ou radial — quand utiliser lequel ?

Les dégradés linéaires créent une impression de direction lumineuse et conviennent parfaitement aux arrière-plans, en-têtes et boutons. Les dégradés radiaux suggèrent un point focal ou une profondeur, utiles pour les projecteurs, les vignetages et les éléments décoratifs.

Puis-je ajouter plus de deux arrêts de couleur ?

Oui. Les dégradés avec plusieurs arrêts vous permettent de créer des arcs-en-ciel, des couchers de soleil et des transitions plus nuancées. Les arrêts peuvent être placés à n'importe quel pourcentage le long de la ligne de dégradé — pas seulement aux extrémités.