Fonds d'écran
Coloriages

Générateur de Dégradés

Créez des Dégradés Linéaires, Radiaux et Mesh Visuellement

Créez des dégradés linéaires ou radiaux avec un code CSS prêt à copier-coller.

Dépose une image pour en extraire les couleurs, ou choisis une couleur ci-dessous

Essai gratuit.

Choisissez deux couleurs ou plus, ajustez le dégradé à votre goût, copiez le CSS. Ou téléchargez en PNG pour l'utiliser comme fond d'écran, arrière-plan de diapositive ou décor de publication sur les réseaux sociaux. Les dégradés linéaires, radiaux et coniques sont tous pris en charge, plus un mode de dégradé mesh pour les fonds doux de style Apple que l'on voit dans les interfaces modernes.

Types de dégradés expliqués

  • Linéaire : ligne droite de la couleur A à la couleur B. Sélecteur de direction (haut→bas, diagonale, etc.).
  • Radial : concentrique — la couleur A au centre s'estompe vers la couleur B sur les bords. Utile pour les effets de projecteur.
  • Conique : balaye autour d'un point central comme une roue chromatique. Tendance dans le design d'interface moderne.
  • Mesh (premium) : plusieurs taches de couleur mélangées en douceur. Le look « dégradé Apple ».

Ce que vous pouvez copier

  1. CSS : prêt à coller la déclaration linear-gradient(...) ou background-image:.
  2. Tailwind : la classe bg-gradient-* la plus proche plus les ajouts de couleurs personnalisées.
  3. SVG : pour une utilisation scalable dans les icônes ou les graphiques d'interface.
  4. Téléchargement PNG : n'importe quelle taille, y compris fond d'écran téléphone (1284×2778), bureau (3840×2160) et carré (1080×1080).

Cas d'utilisation courants

  • Fonds d'écran pour téléphone : les dégradés mesh sont très populaires sur iOS. Essayez notre Aperçu de fond d'écran iPhone pour tester.
  • Fonds pour publications sur les réseaux sociaux : un look instantanément fidèle à la marque pour les graphiques de citations.
  • Sections Hero : les arrière-plans en dégradé sont omniprésents sur les pages d'atterrissage.
  • Présentations de diapositives : remplacez les fonds unis ennuyeux.

Choisir des couleurs qui fonctionnent

Adjacentes sur la roue chromatique = subtil, harmonieux. Opposées = audacieux, accrocheur. Ajoutez un troisième point intermédiaire pour combler un écart important. Pour des dégradés fidèles à la marque, collez votre HEX de marque et choisissez une teinte ou une nuance pour le deuxième point. Utilisez notre Convertisseur de couleurs pour trouver des teintes (HSL avec luminosité plus élevée) ou des nuances (plus basse).

Questions fréquentes

Puis-je les utiliser en production ?

Oui — le CSS copié fonctionne dans tout navigateur moderne. Des alternatives SVG sont fournies pour les cibles plus anciennes.

Qu'en est-il du support des dégradés radiaux par les navigateurs ?

Universel dans les navigateurs modernes. La syntaxe CSS tient en une ligne.

Quelle est la taille maximale d'exportation du PNG ?

Gratuit : jusqu'à 4K (3840×2160). Premium : 8K et au-delà.

Les gradients de maillage sont-ils difficiles à utiliser ?

Sur le web, ils sont basés sur SVG ou canvas. Nous vous fournissons un PNG aplati pour une utilisation facile, ainsi que la source SVG pour l'édition.

Puis-je sauvegarder mes dégradés ?

Connectez-vous (gratuit) et les dégradés sauvegardés apparaîtront dans votre bibliothèque.

Qu'est-ce qu'un 'dégradé conique' ?

Il balaie autour d'un point — comme une roue chromatique ou un diagramme circulaire. Le CSS moderne le supporte nativement.

Est-ce que cela fonctionne pour les dégradés animés ?

Exportation statique uniquement. Pour les arrière-plans animés, copiez le CSS et ajoutez une animation CSS autour de l'angle du dégradé.

Pourquoi ne pas simplement écrire le CSS à la main ?

Vous pouvez — l'outil accélère simplement l'itération visuelle. Copiez et ajustez.

À propos Générateur de Dégradés

Générateur de Dégradés est un outil en ligne gratuit de Wallpapers.com qui fonctionne entièrement dans votre navigateur — pas d'installation, pas de filigrane, pas d'inscription par e-mail pour le premier essai. Créez des dégradés linéaires ou radiaux avec un code CSS prêt à copier-coller.

Comment l'utiliser Générateur de Dégradés

  1. Choisissez une couleur à partir de l'échantillon ou collez une valeur HEX / RVB.
  2. Ajustez le résultat — palette, contraste, couleurs complémentaires.
  3. Copiez la valeur, ou exportez l'échantillon au format JSON.

Quand l'utiliser

Les cas d'utilisation courants incluent : préparation d'images pour le web, listes e-commerce, plateformes de réseaux sociaux avec contraintes de format, et conversion de fichiers d'un appareil ou d'une application à une autre.

Gratuit vs Premium

Chaque visiteur bénéficie d'un essai gratuit ; les utilisateurs gratuits connectés obtiennent un quota quotidien plus élevé. Abonnez-vous à Premium pour des exécutions illimitées, un traitement par lot jusqu'à 200 images par tâche, une file d'attente prioritaire et une navigation sans publicité.

Outils similaires

Vous cherchez quelque chose de légèrement différent ? Essayez le Sélecteur de couleur depuis une image , Extracteur de palette ou Convertisseur en nuances de gris — ou parcourez tous les Outils de couleur outils.

Premium

Débloque tous les outils — sans limite, sans attente

  • ✓ 200 crédits IA / mois — génération d'image, agrandissement, retouche
  • ✓ Traitement en lot (jusqu'à 200 fichiers d'un coup)
  • ✓ Téléchargements 8K + navigation sans pub
  • ✓ File prioritaire — aucune limite de débit
Essaie gratuitement pendant 7 jours →
live
Make wallpapers
with AI.
Try