Tons dégradés modernes : 20 combinaisons de palettes à essayer

Les dégradés rendent les couleurs vivantes : ils guident le regard, ajoutent de la profondeur et créent une ambiance avec moins d’éléments. Une bonne palette de couleurs en dégradé peut transformer une mise en page simple en quelque chose de haut de gamme et moderne.

Vous trouverez ci-dessous plus de 20 palettes de dégradés avec codes HEX prêts à l’emploi, notes d’ambiance et exemples d’utilisation pour l’UI, l’image de marque, les affiches et plus encore.

Pourquoi les palettes de dégradés fonctionnent si bien

Les dégradés créent une hiérarchie visuelle naturelle en passant de zones à fort contraste à des zones à faible contraste, ce qui vous aide à placer les titres, les boutons d’appel à l’action et les éléments clés là où ils seront remarqués en premier.

Ils adoucissent également les transitions entre les couleurs de la marque, rendant les combinaisons audacieuses intentionnelles plutôt que « discordantes ». C’est particulièrement utile pour l’UI, où les dégradés peuvent séparer les sections sans utiliser de bordures épaisses.

Enfin, les palettes de dégradés ajoutent instantanément de l’émotion — les mélanges chauds dégagent une sensation conviviale et énergique, tandis que les mélanges froids paraissent plus épurés et technologiques, sans qu’il soit nécessaire d’utiliser des images complexes.

20+ idées de palettes de couleurs en dégradé (avec codes HEX)

1) Drift de coucher de soleil

HEX : #ff6b6b #ff9f68 #ffd56b #7ee8a6 #5aa9ff

Ambiance : chaude, optimiste, estivale

Idéal pour : affiche de voyage

Chaud et optimiste, il rappelle la dernière heure de soleil glissant dans un ciel dégagé. La transition pêche-bleu offre des combinaisons de dégradés intenses pour les affiches, bandesau ou couvertures. Associez-le à du blanc cassé et une police sans sérif audacieuse pour un look moderne. Astuce : utilisez le corail comme touche de mise en avant et le bleu en fond pour un bon équilibre.

Exemple d’image de drift de coucher de soleil généré via media.io

Media.io

Media.io est un studio en ligne d’IA pour créer et éditer vidéo, image et audio dans votre navigateur.

Essayez maintenant gratuitement

2) Pulsation d’aurore

HEX : #1b1f3a #3a2a7a #6d42c7 #22d3ee #a7f3d0

Ambiance : électrique, nocturne, futuriste

Idéal pour : pochette d’album de musique

Électrique et nocturne, il évoque les bandeaux d’aurore dans la nuit profonde. La base indigo donne du poids à votre création, tandis que le cyan et la menthe ajoutent un effet néon sans agressivité. Utilisez-le avec du noir ou un bleu marine très sombre et gardez le texte minimal pour un aspect haut de gamme. Astuce : réservez le cyan lumineux pour les petits accents afin que la lumière semble intentionnelle.

Exemple d’image de pulsation d’aurore généré via media.io

3) Brume de barbe à papa

HEX : #ff5fd7 #ff8bd3 #ffc2e8 #b8b5ff #6a7bff

Ambiance : ludique, onirique, jeune

Idéal pour : publication beauté sur réseaux sociaux

Ludique et rêveur, ces tons rappellent du sucre filé qui fond dans le crépuscule. L’éventail du rose au pervenche valorise les visuels beauté et fait ressortir les formes des produits et de la peau. À associer avec du blanc pur et des légendes anthracite pour ne pas tomber dans le trop sucré. Astuce : gardez les dégradés larges et doux et ajoutez du texte net pour le contraste.

Exemple d’image de brume de barbe à papa généré via media.io

4) Verre océanique

HEX : #0b1320 #0ea5a5 #34d399 #a7f3d0 #e6fffb

Ambiance : frais, épuré, côtier

Idéal pour : section héro d’un site SaaS

Frais et clair, il rappelle la lumière filtrée à travers l’eau peu profonde et le verre de mer. En palette de couleur dégradé, il est idéal pour des pages héros SaaS, pages de confiance fintech, ou onboarding qui requièrent de la clarté. À mixer à du texte encre foncée et des icônes ligne simples pour garder l’aspect aéré. Astuce : placez la teinte presque blanche sous les blocs de texte pour une lecture immédiate.

Exemple d’image de verre océanique généré via media.io

5) Floraison d’agrumes

HEX : #ffb703 #fb8500 #ff595e #8ecae6 #219ebc

Ambiance : énergique, audacieux, dynamique

Idéal pour : flyer événement estival

Énergique et audacieux, il rappelle le zeste d’agrume et la lumière vive du jour. Les tons orange et corail captent l’attention, tandis que les deux bleus évitent la surchauffe de l’ensemble. À associer à des titres gras et beaucoup d’espace négatif pour garantir la lisibilité. Astuce : utilisez le jaune pour mettre en avant et le bleu foncé pour les détails de l’événement.

Exemple d’image de floraison d’agrumes généré via media.io

6) Brume de bois de rose

HEX : #2b1d1f #6b2d3a #b35c7a #e3a6b9 #f6e9ed

Ambiance : romantique, doux, vintage

Idéal pour : invitation de mariage

Romantique et doux, il rappelle les roses pressées et le crépuscule velouté. Le bois de rose profond ancre les tons plus clairs, rendant l’ensemble élégant plutôt que pastel. À marier avec un titre en sérif et un grain de papier subtilement texturé pour une touche intemporelle. Astuce : réservez la teinte la plus sombre pour les noms et les bordures, pas pour les fonds.

Exemple d’image de brume de bois de rose généré via media.io

7) Lagon néon

HEX : #001219 #005f73 #0a9396 #94d2bd #ee9b00

Ambiance : aventureux, moderne, très contrasté

Idéal pour : bannière marque sportive

Aventureux et moderne, il évoque l’eau profonde éclairée par les projecteurs d’un stade. La pile de sarcelles crée des combinaisons de dégradés nettes, et l’accent ambre apporte un éclat instantané pour boutons et badges. Associez avec du noir, une police étroite et grasse, et des diagonales franches pour l’effet dynamique. Astuce : n’utilisez l’ambre que sur 5 à 10 % de la mise en page pour garder l’intensité.

Exemple d’image de lagon néon généré via media.io

8) Lilas givré

HEX : #2d1b45 #5b2a86 #8b5cf6 #c4b5fd #f5f3ff

Ambiance : calme, raffiné, légèrement magique

Idéal pour : onboarding application de méditation

Calme et raffiné, il évoque la lavande du crépuscule et un soupir relaxant. Le violet moyen est accueillant pour l’onboarding, tandis que le quasi-blanc garantit un contenu lisible. À combiner avec des formes de l’UI arrondies et des animations douces pour renforcer l’ambiance apaisante. Astuce : placez le CTA principal en violet saturé et conservez les autres boutons en lilas pâle.

Exemple d’image de lilas givré généré via media.io

9) Mirage du désert

HEX : #3a2d1f #a67c52 #d9a441 #f2d0a7 #f7f3e8

Ambiance : terreux, ensoleillé, accueillant

Idéal pour : menu de café

Terreux et chauffé par le soleil, il évoque des dunes, de la cannelle et de la céramique chaude. Les tons beige et caramel paraissent naturels dans les designs liés à l’alimentation et à l’hospitalité, en particulier avec de simples illustrations. Associez-les à un texte espresso foncé et un fond crème pour un menu confortable et lisible. Astuce : utilisez la teinte dorée pour les titres de sections afin de guider l’œil.

Exemple d'image de mirage désertique générée avec media.io

10) Velours de Minuit

HEX : #05070f #1b1035 #3b1d6b #7c3aed #f0abfc

Ambiance : luxueux, dramatique, nocturne

Idéal pour : affiche de boîte de nuit

Luxueux et dramatique, il rappelle des rideaux de velours et des enseignes néon après la tombée de la nuit. Ces tons forment une palette de couleurs en dégradé idéale pour des affiches nocturnes, des line-up de DJ et une typographie percutante. Associez-le à des espaces noirs et des accents métalliques brillants pour un résultat haut de gamme. Astuce : placez le violet vif derrière le titre principal pour le faire briller sans ajouter d’effets.

Exemple d'image de velours de minuit générée avec media.io

11) Prairie de Printemps

HEX : #14532d #22c55e #a3e635 #fef08a #fff7ed

Ambiance : frais, botanique, joyeux

Idéal pour : impression illustration botanique

Frais et botanique, il évoque de nouvelles feuilles, la lumière du soleil et le pollen doux. Les verts restent vifs sans devenir fluo, et le jaune pâle garde le mélange accueillant. Associez-le à un travail au trait dessiné à la main et beaucoup de fond crème pour que la palette respire. Astuce : utilisez le vert le plus foncé avec parcimonie pour les tiges et contours afin d’apporter de la structure.

Exemple d'image de prairie de printemps générée avec media.io

12) Skyline Arctique

HEX : #0f172a #1e3a8a #2563eb #60a5fa #e0f2fe

Ambiance : froid, confiant, tourné vers la technologie

Idéal pour : interface tableau de bord

Froid et confiant, il ressemble à l’air hivernal sur une skyline urbaine vitrée. Les bleus offrent une hiérarchie claire pour les graphiques, onglets et navigation, surtout avec un espace blanc net. Associez-le à des gris neutres et un seul accent chaleureux si vous avez besoin d’alertes ou avertissements. Astuce : gardez le bleu marine le plus foncé pour les barres latérales afin de réduire le bruit visuel.

Exemple d'image du skyline arctique générée avec media.io

13) Sorbet Mangue

HEX : #ff4d6d #ff758f #ffa94d #ffd166 #fff3b0

Ambiance : sucré, vivant, accessible

Idéal pour : promo d’application livraison de nourriture

Sucré et dynamique, il rappelle des tranches de fruit et un emballage coloré sur un comptoir ensoleillé. Les roses ajoutent de la convivialité tandis que les tons mangue et citron stimulent l’appétit. Associez-le à des coins arrondis et des icônes simples pour garder le côté ludique, sans désordre. Astuce : affichez les prix promo en rose profond pour une lecture rapide.

Exemple d'image de sorbet mangue générée avec media.io

14) Ardoise Orageuse

HEX : #0b1020 #1f2937 #4b5563 #9ca3af #f3f4f6

Ambiance : minimaliste, sérieux, éditorial

Idéal pour : mise en page rapport d'entreprise

Minimaliste et sérieux, il évoque un ciel nuageux sur du béton. La gamme ardoise est parfaite pour les rapports, propositions et présentations où le contenu doit prédominer. Associez-le à un accent saturé de votre marque pour mettre en évidence les chiffres et graphiques clés. Astuce : utilisez le gris le plus clair pour les tableaux afin de garder les lignes et chiffres tranquilles.

Exemple d'image d’ardoise orageuse générée avec media.io

15) Fleur de Pêcher

HEX : #ffedd5 #fed7aa #fdba74 #fb7185 #be123c

Ambiance : romantique, accueillant, joyeux

Idéal pour : affiche pour la Saint-Valentin

Romantique et invitant, il évoque des pétales de pêche avec une touche rouge baie. Les tons clairs et chaleureux gardent la palette conviviale, tandis que le cramoisi profond ajoute du drame aux titres. Associez-le à des fonds crème et au trait délicat pour conserver l’élégance. Astuce : utilisez le rouge le plus foncé uniquement sur le texte essentiel pour ne pas écraser les tons plus doux.

Exemple d’image de fleur de pêcher générée avec media.io

16) Baie Galactique

HEX : #0a0f2c #2b1055 #5b21b6 #db2777 #fbcfe8

Ambiance : cosmique, audacieux, expressif

Idéal pour : overlay streaming de jeux vidéo

Cosmique et audacieux, il suggère des champs d’étoiles avec une éclat de néon baie. Les bleus et violets profonds créent un contraste marqué pour les alertes, libellés et panneaux de stream. Associez-le à du texte blanc et des traits fins pour que l’overlay reste lisible sur le jeu. Astuce : gardez le rose vif pour les badges et appels pour attirer l’attention instantanément.

Exemple d’image de baie galactique générée avec media.io

17) Menthe Glace

HEX : #ecfeff #cffafe #67e8f9 #34d399 #0f766e

Ambiance : rafraîchissant, léger, convivial

Idéal pour : publicité produit de soin

Rafraîchissant et léger, il évoque la menthe fraîche et l’eau pure. Cette palette en dégradé convient aux publicités pour soins de la peau, pages wellness et emballages où un aspect hygiénique est crucial. Associez-la à une typographie minimale et beaucoup de blanc pour garder un aspect clinique mais chaleureux. Astuce : placez le bleu-vert le plus intense uniquement dans le logo ou petites étiquettes pour un fini prestigieux.

Exemple d'image de menthe glace générée avec media.io

18) Crépuscule Cuivré

HEX : #1f1300 #7c2d12 #c2410c #fb923c #fde68a

Ambiance : chaleureux, cinématographique, automnal

Idéal pour : design de couverture de livre

Chaleureux et cinématographique, il évoque une lumière cuivrée sur un fond de soirée profonde. La gamme orange brûlé est idéale pour les couvertures de fiction, l’art de podcast et les titres éditoriaux. Associez-le à une police avec empattement classique et un grain discret pour ajouter de la chaleur sans perdre en clarté. Astuce : laissez l’or pâle derrière le titre pour un contraste instantané.

Exemple d'image de crépuscule cuivré générée avec media.io

19) Skyline Néon

HEX : #111827 #2563eb #22c55e #f97316 #f43f5e

Ambiance : urbain, lumineux, dynamique

Idéal pour : couverture deck pitch startup

Urbain et lumineux, il rappelle des LED de ville reflétées dans le verre. Ce mélange offre des combinaisons de dégradés flexibles pour les slides de couverture, sections et blocs en valeur. Associez-le à beaucoup d’espace gris charbon pour que les couleurs paraissent intentionnelles, pas brouillonnes. Astuce : choisissez une teinte dominante par slide et réutilisez-la pour les icônes et accents graphiques.

Exemple d’image de skyline néon générée avec media.io

20) Grès Doux

HEX : #f8fafc #e2e8f0 #cbd5e1 #f5d0c5 #f0abfc

Ambiance : doux, aérien, moderne

Idéal pour : en-tête blog minimaliste

Doux et aérien, il ressemble à de la pierre pâle avec une nuance rosée. Les gris froids gardent la structure du layout, tandis que les accents rose-lilas ajoutent de la personnalité sans attirer toute l’attention. Associez-le à une typographie fine et à un espacement généreux pour une expérience de lecture paisible. Astuce : utilisez le gris doux comme base et réservez les roses pour de petites décorations ou effets de soulignement.

Exemple d’image de grès doux générée avec media.io

21) Crépuscule Tropical

HEX : #072146 #0b5fff #00c2ff #00d084 #f9c74f

Ambiance : vibrant, tropical, assuré

Idéal pour : bannière lancement produit

Vibrant et tropical, il mélange bleu océan profond, bleu piscine éclatant et une touche de soleil. Les tons froids gardent le côté technologique, tandis que le jaune apporte l’excitation recherchée pour un lancement. Associez-le à des rendus produits simples et une typographie forte alignée à gauche pour garder la bannière nette. Astuce : utilisez le jaune uniquement pour le CTA afin de créer une cible de clic claire.

Exemple d’image de crépuscule tropical générée avec media.io

Quelles couleurs s’accordent bien avec un dégradé ?

Les neutres (blanc, blanc cassé, charbon et gris froid) s’associent très bien aux dégradés parce qu’ils laissent le mélange “briller” sans rivaliser pour l’attention. Dans une interface, cela signifie souvent des fonds dégradés plus texte et icônes solides.

Pour un contraste plus fort, ajoutez une couleur accent contrôlée (souvent l’arrêt le plus saturé de votre dégradé) pour les boutons, badges et petits highlights. Cela permet à vos palettes de dégradé de rester cohérentes entre les pages et composants.

Si votre dégradé est déjà vif, utilisez des teintes plus sombres (marine, violet foncé, presque noir) pour stabiliser le design et améliorer la lisibilité—en particulier pour les titres et le texte fin.

Comment utiliser une palette de couleurs en dégradé dans des designs réels

Commencez par les rôles : choisissez un ou deux arrêts pour le texte et les surfaces UI, puis réservez le dégradé complet pour les zones héros, couvertures ou grandes formes. Cela évite la “fatigue du dégradé partout” et garde les interfaces utilisables.

Utilisez des dégradés pour créer de la profondeur : appliquez des mélanges doux sur les fonds et des mélanges plus marqués sur les formes centrales. Pour les affiches et graphiques sociaux, agrandissez la zone de dégradé et gardez une typographie nette pour un contraste propre.

Testez toujours la lisibilité : placez votre texte principal sur la couleur la plus claire (ou ajoutez une superposition subtile) et vérifiez le contraste sur mobile. Un joli schéma de couleurs en dégradé ne fonctionne que si les utilisateurs peuvent le lire rapidement.

Créer des visuels de palettes de dégradés avec l’IA

Si vous voulez prévisualiser ces combinaisons de couleurs dégradées comme affiches, héros de landing page, packaging ou maquettes UI, générer des visuels rapides peut vous aider à choisir plus vite qu’en modifiant des échantillons à la main.

Media.io Text-to-Image vous permet de transformer un prompt court en designs basés sur des dégradés en quelques secondes. Vous pouvez itérer sur le style, le ratio et la composition tout en gardant vos HEX cohérents.

Choisissez une palette ci-dessus, reprenez son ambiance et sa note “idéal”, puis collez le prompt pour générer un concept sur-mesure à affiner.

Suite : Palette de couleurs Bleu-Magenta