Idées de palettes de couleurs gris ardoise (20 choix + Hex)

Le gris ardoise est l’un de ces neutres « qui fonctionnent toujours » : frais, posé, et facile à adapter de fonds subtils à une typographie audacieuse.

Voici plus de 20 idées de palettes de couleurs gris ardoise avec codes HEX à utiliser pour les interfaces, le branding ou l’intérieur — plus des conseils d’associations rapides et des prompts IA pour générer des visuels rapidement.

Pourquoi les palettes gris ardoise fonctionnent si bien

Le gris ardoise se trouve à la frontière entre les tons bleu-gris et les neutres atténués, pour un aspect moderne sans tomber dans l’industriel froid par défaut. Selon l’intensité, il peut servir de « fond » ou de « structure ».

Dans les produits digitaux, le gris ardoise crée une forte hiérarchie : des tons profonds pour la navigation et les titres, des tons clairs pour les surfaces, et une couleur d’accent pour les actions. Cela le rend très efficace pour les tableaux de bord, la fintech, et les mises en page éditoriales.

En design physique (intérieur, packaging), le gris ardoise apporte une sensation de calme. Il se marie naturellement avec des matières chaudes comme le bois, le sable, le laiton ou la terre cuite — pour un rendu raffiné et authentique.

20+ idées de palettes de couleurs gris ardoise (avec codes HEX)

1) Port Brumeux

HEX : #708090 #2F3A44 #AAB2BD #D9D3C7 #C6A15B

Ambiance : calme, côtier, moderne

Idéal pour : dashboard analytique saas

La brume du port et l’acier brossé instaurent une ambiance stable et concentrée. Utilisez-la pour les interfaces de données qui nécessitent du contraste et une bonne hiérarchie, en réservant le charbon foncé à la navigation et aux titres. Le sable chaud et l’or doux évitent un rendu trop froid, surtout pour les graphiques, badges et indicateurs-clés. Astuce : gardez l’or pour une action principale et restez sur les gris ailleurs pour garder une lecture fluide.

Exemple d’image port brumeux générée avec media.io

Media.io

Media.io est un studio IA en ligne pour créer et éditer des vidéos, images et audio dans votre navigateur.

Essayez-le gratuitement

2) Acier Bleu et Rose Poudré

HEX : #708090 #1F2A37 #E8B4B8 #F4F1EC #6BAED6

Ambiance : soigné, chaleureux, aérien

Idéal pour : page d’accueil marque beauté ui

L’acier brillant rencontre le rose poudré pour un rendu à la fois affirmé et accessible. Ces associations autour du gris ardoise fonctionnent très bien pour une page d’accueil où l’on veut de la structure sans perdre la douceur humaine. Mariez le rose poudré au blanc cassé pour le « hero », utilisez le bleu ciel pour les liens et boutons secondaires. Astuce : gardez le texte sur le blanc cassé et réservez le bleu nuit profond aux titres pour garantir l’accessibilité.

Exemple d’image acier bleu et rose poudré générée avec media.io

3) Studio Sauge Cendrée

HEX : #708090 #3E4A3D #C9D2C1 #F2EFE9 #B08A5A

Ambiance : organique, calme, éditorial

Idéal pour : emballage produit céramique

La lumière douce d’un studio et la note argileuse créent une atmosphère artisanale. Utilisez la sauge et le beige chaud pour adoucir la base froide, surtout sur le packaging où le toucher et l’apaisement comptent. Le blanc cassé donne de l’espace aux typos, le vert soutient icônes et ingrédients. Astuce : imprimez l’ardoise en champ principal de l’étiquette, misez sur une seule touche terreuse pour la sophistication.

Exemple d’image studio sauge cendrée générée avec media.io

4) Neutres Fenêtre d’Orage

HEX : #708090 #111827 #9CA3AF #E5E7EB #F59E0B

Ambiance : élégant, contrasté, urbain

Idéal pour : écrans ui appli mobile fintech

Les reflets de pluie et les ombres urbaines apportent un tranchant moderne. Cette palette gris ardoise est idéale pour la fintech qui exige lisibilité, confiance, et repères forts pour les chiffres. Utilisez le presque noir pour les textes et la navigation, puis l’ambre pour les statuts, alertes et actions clés. Astuce : limitez l’ambre à moins de 10% pour qu’il reste efficace sans surcharger.

Exemple d’image neutres fenêtre d’orage générée avec media.io

5) Graphite et Abricot

HEX : #708090 #2B2D31 #F4A261 #F7F3E9 #264653

Ambiance : contraste chaud, moderne, affirmé

Idéal pour : slides de pitch startup

La profondeur du graphite associée à la chaleur de l’abricot insuffle de l’énergie sans excès. Idéal pour les pitchs où il faut des titres nets, des graphiques lisibles et une touche marquante. Gardez le blanc cassé en toile de fond et utilisez l’abricot pour les chiffres clés. Astuce : harmonisez le bleu-vert sur les visuels pour maintenir la cohérence graphique.

Exemple d’image graphite et abricot générée avec media.io

6) Éditorial Jour de Pluie

HEX : #708090 #0B1320 #BFC7D5 #F6F5F2 #7C5CFC

Ambiance : raffiné, feutré, éditorial

Idéal pour : mise en page magazine

Le calme d’un jour de pluie et les contrastes encre créent une ambiance raffinée, parfaite pour le print. Le gris acier pâle garantit le confort de lecture, tandis que le noir profond donne de la présence aux titres/citations. Utilisez peu de violet, en separator, légende ou pour un chiffre remarquable. Astuce : réservez le texte courant au ton le plus sombre et privilégiez une largeur de ligne généreuse pour préserver le calme éditorial.

Exemple d’image éditorial jour de pluie générée avec media.io

7) Béton Nordique

HEX : #708090 #3B4A5A #C7CED6 #F3F4F6 #A3B18A

Ambiance : minimal, aérien, architectural

Idéal pour : guide palette intérieur salon moderne

La lumière nordique sur le béton crée une ambiance minimaliste et respirante. Utilisez le gris ardoise et l’acier pour les peintures, mobilier ou tissus d’ameublement, puis adoucissez avec des surfaces gris-blanc pâle. L’olive discrète est idéale pour des plantes, céramiques ou une chaise. Astuce : répétez la touche olive à deux endroits discrets plutôt qu’un grand objet pour un effet équilibré.

Exemple d’image béton nordique générée avec media.io

8) Accent Sarcelle Minuit

HEX : #708090 #0F172A #0EA5A4 #CBD5E1 #F8FAFC

Ambiance : high-tech, net, froid

Idéal pour : publicité montre connectée

Une profondeur minuit relevée d’une touche sarcelle donne un aspect futuriste et épuré. Les gris pâles gardent un aspect clinique bienvenu, parfait pour les pubs tech exigeant la clarté. Utilisez le sarcelle pour les mises en valeur, effets lumineux et animations, tandis que le ton foncé encadre la montre. Astuce : gardez le fond quasi-blanc et mettez le contraste dans la typo pour garder le produit au centre.

Exemple d’image accent sarcelle minuit générée avec media.io

9) Bureau Rose Poussière

HEX : #708090 #374151 #D1A3A4 #F5F2EE #8AB4F8

Ambiance : professionnel, doux, accueillant

Idéal pour : modèle de rapport d’entreprise

Une lumière de bureau douce et des notes de rose atténuées rendent une mise en page professionnelle plus chaleureuse. Utilisez le gris le plus foncé pour les titres et les lignes de tableau, puis privilégiez le blanc cassé chaleureux pour les longues sections de texte. Le rose poussiéreux fonctionne bien pour les en-têtes de section, tandis que le bleu clair aide les liens et références à ressortir. Astuce : limitez les graphiques à deux couleurs de données plus des tons neutres afin que le rapport soit lu rapidement.

Exemple d'image de bureau rose poussiéreux générée avec media.io

10) Calme Spa Minéral

HEX : #708090 #22303C #A7C4C2 #E9EFEF #CBAE82

Ambiance : apaisant, propre, réparateur

Idéal pour : kit d'identité de marque bien-être

Des tons d’eau minérale et une vapeur douce créent une ambiance réparatrice et propre. Le bleu vert et le blanc brumeux apportent de la fraîcheur, tandis que le beige plus chaud ajoute une touche humaine et naturelle. Utilisez les tons plus sombres pour les logos et la typographie, tout en gardant le packaging et les publications sociales lumineux et aérés. Astuce : choisissez une texture, comme un grain de papier subtil, pour maintenir l'identité calme plutôt que brillante.

Exemple d'image de calme spa minéral générée avec media.io

11) Matériel cuivre

HEX : #708090 #2D3748 #B87333 #EFE7DD #6B7280

Ambiance : industriel, chaud, haut de gamme

Idéal pour : emballage d'appareils de cuisine

L’acier industriel avec une touche de cuivre donne une impression haut de gamme et un peu atelier-chic. Utilisez le ton métallique chaud pour les badges et noms de modèles, tandis que le blanc cassé soutient des instructions et listes de caractéristiques claires. Le gris moyen garde les panneaux secondaires et les icônes discrets sans les faire disparaître. Astuce : imprimez le cuivre sous forme de touche ou de foil pour valoriser la boîte sans abuser de la brillance.

Exemple d'image de matériel cuivre générée avec media.io

12) Laine d’hiver

HEX : #708090 #1F2937 #C4CBD4 #F5F5F4 #A16207

Ambiance : confortable, élégant, intemporel

Idéal pour : mise en page lookbook de mode

La laine sur mesure et l’air froid évoquent une élégance chaleureuse et discrète. Utilisez les gris doux pour les fonds et marges, puis le ton profond pour les titres puissants et les prix. Le brun doré chaleureux apporte une touche de bon goût pour les encarts, numéros de page ou petites règles graphiques. Astuce : gardez la photographie dans des teintes froides afin que la couleur d’accent semble intentionnelle, pas accidentelle.

Exemple d'image de laine d’hiver générée avec media.io

13) Bistro à la chandelle

HEX : #708090 #2B2A2F #E0C097 #F7F1E3 #8C5E3C

Ambiance : intime, chaleureux, chic

Idéal pour : design de menu de restaurant

La chaleur des bougies contre la pierre noire apporte une atmosphère intime et raffinée. Utilisez le ton le plus foncé pour les titres de menu et séparateurs, gardez le texte principal sur un ton de papier crème pour faciliter la lecture. Le beige et le cacao conviennent bien aux icônes, labels alimentaires et bordures discrètes. Astuce : réservez le brun le plus chaud pour les plats signature pour mettre en valeur sans surcharger.

Exemple d'image de bistro à la chandelle générée avec media.io

14) Nuit céleste

HEX : #708090 #0A0F1F #94A3B8 #F8FAFC #F97316

Ambiance : dramatique, moderne, énergique

Idéal pour : affiche de festival musical

Une ambiance de nuit céleste ajoute du drame, avec des touches lumineuses semblables à du néon sur un ciel profond. Utilisez le presque noir pour le fond d'affiche, puis laissez le gris ardoise et le gris pâle structurer la hiérarchie typographique. Une pointe d'orange vive est parfaite pour les dates, infos billets, ou un élément graphique central. Astuce : limitez l’orange à un seul poids typographique pour qu’il soit perçu comme un signal volontaire.

Exemple d'image de nuit céleste générée avec media.io

15) Musée minimal

HEX : #708090 #20262E #B8C0CC #FFFFFF #9B8C7A

Ambiance : calme, sélectionné, galerie propre

Idéal pour : signalétique de musée

Des tons silencieux et soigneusement choisis rappellent un mur de galerie avec un espacement étudié. Utilisez le blanc comme base principale pour la signalétique, puis comptez sur les tons plus sombres pour les flèches, numéros de salles et titres lisibles. L’accent pierre chaude aide à mettre en valeur les expositions spéciales sans heurter les œuvres d’art. Astuce : choisissez un poids d’icônes et gardez le contraste élevé pour la lisibilité à distance.

Exemple d'image de musée minimal générée avec media.io

16) Chemin de galets

HEX : #708090 #334155 #CBD5E1 #F1F5F9 #22C55E

Ambiance : frais, propre, légèrement ludique

Idéal pour : interface d'accueil application

Des galets doux et de l’air frais procurent une énergie propre et légèrement ludique. Utilisez les tons pâles pour des écrans d'accueil spacieux, puis apportez le vert comme signal positif pour la progression, les états de succès et les confirmations. Le gris foncé garde les titres affirmés et fait ressortir les illustrations. Astuce : mettez les indicateurs de progression en vert uniquement sur l’étape active afin que les utilisateurs comprennent instantanément où ils se trouvent.

Exemple d'image de chemin de galets générée avec media.io

17) Dérive olive

HEX : #708090 #2A3D3B #7D8F69 #E6E2D8 #D97706

Ambiance : aventurier, stable, terreux

Idéal pour : bannière e-commerce équipement outdoor

Des tons stables et prêts pour l’aventure évitent le côté trop rustique. L’olive et le gris-vert profond s’accordent avec la photographie de produits, tandis que le sable clair garde les bannières lisibles et ouvertes. Utilisez l’orange chaud comme petit capteur d’attention pour les remises ou éditions limitées. Astuce : gardez l’accent derrière les textes courts seulement, pour mettre en valeur l'offre sans nuire à la photo de produit.

Exemple d'image de dérive olive générée avec media.io

18) Encre et sable

HEX : #708090 #0F172A #D6D3CD #F9FAFB #2563EB

Ambiance : net, moderne, confiant

Idéal pour : interface site portfolio

Le contraste d’encre sur un sable doux donne une impression nette et moderne, comme une page parfaitement composée. Cette palette de gris ardoise convient parfaitement aux sites portfolio où les projets ont de l’espace et où la typographie mène l’histoire. Associez les bleus froids aux sections neutres pour les liens et états de survol, tout en gardant le ton le plus foncé pour la navigation et les titres. Astuce : utilisez le bleu uniquement pour les éléments interactifs afin que les visiteurs reconnaissent instantanément ce qui est cliquable.

Exemple d'image de encre et sable générée avec media.io

19) Lavande nuageuse

HEX : #708090 #2E2A3B #B8B3D6 #F4F3F8 #D4A373

Ambiance : romantique, doux, moderne

Idéal pour : ensemble invitation mariage

La lavande nuageuse et le gris doux sont romantiques tout en restant modernes et propres. Prenez la lavande pâle en champ principal de papier, puis réglez la typographie en gris prune profond pour une lecture élégante. Le beige chaud ajoute une touche subtile et festive pour monogrammes, bordures ou petits motifs. Astuce : gardez les éléments décoratifs fins et minimalistes afin que la palette reste légère, pas trop sucrée.

Exemple d'image de lavande nuageuse générée avec media.io

20) Salle de classe brume portuaire

HEX : #708090 #334E68 #BFD7EA #F0F7FF #F6C453

Ambiance : lumineux, amical, organisé

Idéal pour : infographie éducative

Les bleus brumeux lumineux sont accueillants et organisés, comme un mur de classe apaisant. Utilisez les tons ciel pâle pour les sections et les boîtes, tandis que le bleu-gris profond assure une bonne lisibilité des titres et des labels. Le jaune ensoleillé fonctionne bien pour les faits clés, les icônes et les éléments qui guident l’œil. Astuce : appliquez le jaune à un seul élément récurrent, comme des bulles, pour créer un repère visuel cohérent.

Exemple d'image de salle de classe brume portuaire générée avec media.io

21) Contraste prune fumé

HEX : #708090 #2B1B2E #A78BFA #EDE9FE #94A3B8

Ambiance : créatif, luxe, légèrement ténébreux

Idéal pour : design couverture livre

La prune fumée et la violette douce évoquent créativité et luxe discret, comme une encre au crépuscule sur papier texturé. Utilisez la prune profonde pour le fond ou le bloc de titre, puis la violette pâle pour le nom de l’auteur et les petits détails. Le gris-bleu froid ancre le design afin d’éviter un effet violet trop sucré. Astuce : placez le titre principal en serif très contrasté et gardez les autres textes minimalistes pour une finition moderne.

Exemple d'image de contraste prune fumé générée avec media.io

Quelles couleurs se marient bien avec le gris ardoise ?

Le gris ardoise s’associe facilement aux tons chauds et neutres comme le sable, la crème, le beige et le blé pour un rendu plus doux et accueillant. Ces nuances « réchauffent » la base bleu-gris sans perdre le côté moderne.

Pour un contraste digital net, combinez le gris ardoise avec du noir quasi total/navy et un blanc cassé propre, puis ajoutez un accent très visible (ambre, orange, turquoise ou bleu électrique) pour les CTA et états.

Pour une palette plus expressive, le gris ardoise s’accorde aussi avec des pastels discrets (rose poussiéreux, lavande) et verts naturels (sauge, olive), maintenant l’ensemble calme tout en ajoutant de la personnalité.

Comment utiliser une palette gris ardoise dans des designs concrets

Commencez par attribuer les rôles : utilisez une ardoise/charbon foncé pour le texte principal et la navigation, une ardoise moyenne pour les éléments secondaires de l’UI, et des gris très clairs pour les surfaces et espaces. Cela garantit lisibilité et cohérence à travers les pages.

Ensuite, choisissez une famille d’accent et tenez-vous à celle-ci. Les accents chauds (or, abricot, cuivre) sont premium et conviviaux, tandis que les accents froids (turquoise, ciel, violet) sont plus nets et techniques.

Enfin, testez le contraste dès le début — surtout pour les boutons, petits labels et data visualisations. Le gris ardoise est subtil, donc une hiérarchie réfléchie évite que tout se fonde dans le même « joli gris ».

Créez des visuels de palettes gris ardoise avec l’IA

Si vous créez un moodboard, un concept d’UI ou une maquette packaging, générer des visuels sur base de palette aide à valider l’ambiance avant de passer aux fichiers de prod.

Avec l’outil texte-vers-image de Media.io, vous pouvez coller un prompt (comme dans les exemples ci-dessus), préciser le ratio, et itérer rapidement jusqu’à ce que la lumière, les matières et le style correspondent à votre marque.

Une fois qu’une direction vous plaît, gardez la base gris ardoise constante et ne changez que la couleur d’accent pour explorer plusieurs variantes sans repartir de zéro.

Suite : Palette de couleurs Blé