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

Mode d’emploi

1. Un dégradé est déjà à l’écran à l’ouverture de la page — le premier résultat ne demande aucun clic.
2. Choisissez un type : « Linéaire » suit un angle, « Radial » part d’un cercle, « Conique » balaie autour d’un centre. Modifiez l’angle avec le curseur pour le linéaire et le conique.
3. Définissez les couleurs avec les échantillons et faites glisser chaque position (0–100 %). Ajoutez des couleurs avec « + Ajouter une couleur » pour un dégradé multicolore ; retirez-en jusqu’à deux.
4. Le CSS se met à jour en direct en dessous — copiez-le en un clic et collez-le partout où du CSS est accepté.

Portée, limites et questions courantes

• Couleurs opaques uniquement : les échantillons sont des sélecteurs du navigateur et n’affichent pas d’alpha. Pour la transparence, convertissez d’abord la couleur en forme avec alpha, puis revenez.
• Un seul segment standard : linéaire, radial ou conique — pas de préfixes -webkit-, pas d’astuces de fonds superposés, pas de dimensionnement radial ni de positionnement du centre.
• Les arrêts conservent l’ordre d’ajout — ils ne sont pas triés automatiquement, une position hors ordre crée donc volontairement une transition brutale.
• Entre 2 et 8 arrêts. Descendre à un seul arrêt arrête le dégradé (avec un avis) plutôt que d’en simuler un.
• Pas de bibliothèque de préréglages, pas d’application au fond de page entière, pas de lien de partage transportant le dégradé — le bouton de partage ne partage que l’URL de la page ; rien n’est envoyé, stocké ni écrit dans l’URL.
• L’angle n’a pas de sens pour un dégradé radial : le contrôle d’angle se cache et le code généré n’a pas d’angle.