Outil Gratuit

CSS Gradient Generator

Créez visuellement des dégradés CSS linéaires, radiaux et coniques. Glissez les arrêts de couleur, ajustez l'angle et la position, et copiez le CSS prêt à l'emploi.

CSS
background: linear-gradient(135deg, #6366f1 0%, #06b6d4 100%);
Type
Angle135°
Arrêts de couleur
0%
100%
Présets

Types de dégradés

Les dégradés linéaires font la transition le long d'une ligne droite à n'importe quel angle. Les dégradés radiaux rayonnent à partir d'un point central. Les dégradés coniques balaient autour d'un point central — utiles pour les graphiques en camembert et les roues chromatiques.

Comment utiliser

  1. Choisissez un type de dégradé (linéaire, radial ou conique).
  2. Ajoutez ou glissez les arrêts de couleur pour définir les couleurs.
  3. Copiez la sortie CSS directement dans votre feuille de style.

Tout le traitement se fait dans votre navigateur — rien n'est envoyé à aucun serveur.

Depuis le blog Skybin

Free developer tools from Skybin

Lire le guide sur Skybin

Questions Fréquemment Posées

Le CSS généré est-il compatible avec tous les navigateurs ?
Oui. La sortie utilise la syntaxe standard des dégradés CSS prise en charge par tous les navigateurs modernes.
Puis-je partager un dégradé ?
Oui. Cliquez sur Partager — l'état du dégradé est codé dans l'URL, que vous pouvez copier et envoyer.