Comment supprimer un arrêt de couleur ?

Sélectionnez l’arrêt et appuyez sur Suppr ou Retour arrière, ou utilisez le bouton corbeille. Un dégradé garde toujours au moins deux arrêts.

Ces dégradés fonctionnent-ils dans tous les navigateurs ?

Les dégradés linéaires et radiaux fonctionnent dans tous les navigateurs actuels. Les dégradés coniques fonctionnent dans Chrome, Edge, Firefox et Safari 12.1 ou ultérieur.

Puis-je déplacer les arrêts au clavier ?

Oui. Placez le focus sur un arrêt avec Tab et utilisez les flèches (Maj pour des pas de 10), Début et Fin. Le cadran d’angle fonctionne aussi avec les flèches.

Générateur de dégradés CSS — Linéaire, radial et conique

Créez des dégradés CSS linéaires, radiaux et coniques avec des arrêts de couleur déplaçables, un cadran d’angle et des presets. Copiez le CSS ou une classe Tailwind.

Arrêts de couleurCliquez pour ajouter · glissez pour déplacer

CSS

background: #fa69c3;
background: linear-gradient(120deg, #7f5af0 0%, #ff6ac1 52%, #ffb86b 100%);

Tailwind

bg-[linear-gradient(120deg,#7f5af0_0%,#ff6ac1_52%,#ffb86b_100%)]

Presets

Références des formats

MDN — CSS gradients
Tailwind CSS — Arbitrary values

Page de l’outil mise à jour le : 2026-10-23

Presets

Guide et exemple

Outils associés

Références des formats