20 migliori abbinamenti grigio e blu scuro: codici colore e consigli

Le tavolozze grigio blu scuro si trovano proprio nel punto dolce tra moderno neutro e profondo, colore sicuro. Leggono pulito nell'interfaccia utente, si sentono premium nel branding e rimangono calmi e composti negli interni.

Dai grigi ispirati al cemento agli accenti blu navy inchiostro, questi schemi sono facili da scalare su sfondi, tipografia ed elementi di supporto, senza perdere contrasto o chiarezza.

Perché le tavolozze grigio e blu scuro funzionano così bene

Il grigio e il blu scuro creano un contrasto naturalmente equilibrato: il grigio porta neutralità e struttura, mentre il blu scuro aggiunge profondità e autorità. Insieme, si sentono moderni senza diventare sterili.

Queste tavolozze sono anche flessibili su tutti i mezzi. Sui schermi, i blu scuri con inclinazione blu navy supportano la tipografia leggibile e gli stati dell'interfaccia utente accessibili; Nella stampa, i grigi freddi mantengono i layout nitidi e coerenti.

Poiché le tonalità sono limitate, puoi introdurre un singolo accento (come il rame, il corallo o il verde neon) e creare immediatamente una gerarchia, senza combattere lo schema di base.

20+ idee di tavolozza di colori grigio blu scuro (con codici esagonali)

1) calcestruzzo tempestoso

esagonale:#2b2f36#404754#5d6675#8a919c

umore:Urbano, calmo, a terra

Migliore per:moodboards di design d'interni moderni

Il calcestruzzo fresco, lavato dalla pioggia e le ombre di mezzanotte danno un tono calmo e urbano. Il mix si legge raffinato senza sentirsi freddo, soprattutto quando si aggiunge legno caldo o ottone spazzolato. Utilizza questa tavolozza di colori grigio blu scuro per soggiorni, spazi di ufficio o presentazioni di architettura dove la chiarezza è importante. Suggerimento: mantenere il grigio più chiaro come colore principale della superficie, quindi riservare il blu navy intenso per le finiture e i pezzi focali.

Immagine Esempio di calcestruzzo tempestoso generato utilizzando media.io

Media.io

Media.io è uno studio di intelligenza artificiale online per creare e modificare video, immagini e audio nel tuo browser.

Provalo ora gratuitamente

2) Porto di mezzanotte

esagonale:#0b1d33#123a5a#1f5a7a#6b7c8a#d7dde2

umore:nautico, cinematografico, fiducioso

Migliore per:Banner e landing pages di brand hero

L'acqua inchiostro, le luci del banco e un orizzonte nitido conferiscono a questo set un aspetto cinematografico. Brilla sulle sezioni degli eroi, dove i blues profondi possono portare il titolo mentre i grigi freddi mantengono il layout pulito. Abbinare con un singolo accento caldo come rame o corallo per un contrasto istantaneo. Suggerimento: utilizzare il grigio pallido per lo sfondo del testo per evitare una pagina pesante e scura.

Esempio di immagine di midnight harbor generato utilizzando media.io

3) ardesia e argento

esagonale:#1c2430#2f3b4a#4a5665#a7b0ba#f2f4f6

umore:Lucido, Minimale, Professionale

Migliore per:slide deck e report aziendali

L'ardesia liscia e il morbido argento sembrano un abito ben realizzato sotto la fresca illuminazione dell'ufficio. I toni mantengono grafici, tabelle e copie dense leggibili senza sembrare insipido. Aggiungi un colore di accento moderato come teal o oro per callouts e interruzioni di sezione. Suggerimento: riserva la tonalità più scura per intestazioni e numeri chiave per creare una gerarchia istantanea.

Esempio di immagine di slate & silver generato utilizzando media.io

4) Ufficio Denim

esagonale:#0f2a43#1e3a57#3a5872#7c8b97#e6e9ec

umore:Accessibile, moderno, affidabile

Migliore per:Interfaccia utente SaaS e schermate di impostazione

Blu denim pulito con neutri grigi morbidi si sentono amichevoli e produttivi. La gamma di contrasti supporta stati chiari dell'interfaccia utente, dalla navigazione ai divisori sottili. Abbinare con un colore d'azione brillante come lime o ciano per i pulsanti primari. Suggerimento: utilizzare il blu di tono medio per stati selezionati in modo che la tonalità più scura rimanga disponibile per il testo pesante di accessibilità.

Esempio di immagine di denim office generato utilizzando media.io

5) Asfalto invernale

esagonale:#1a2028#2d3540#444e5c#8b949e#f7f8fa

umore:Croccante, fresco, sobrio

Migliore per:lookbooks di moda e sfondi di fotografia di e-commerce

La luce gelida sull'asfalto scuro crea un freddo pulito e editoriale. La tavolozza supporta scatti di prodotto e tipografia senza rubare l'attenzione dai tessuti o dalle silhouette. Abbinare con lo spazio off-white e un singolo accento punchy come il rosso per i tag di vendita. Suggerimento: mantenere le ombre leggermente blu per mantenere la sensazione invernale attraverso le foto.

Immagine Esempio di asfalto invernale generato utilizzando media.io

6) Inkbound minimo

esagonale:#111822#1e2a3a#2f4157#7a8696#dfe4ea

umore:Concentrato, elegante, silenzioso

Migliore per:portfolio Siti Web e Casi Studi

Toni di inchiostro profondi e grigi ammorbiditi sembrano una scrivania in studio ben illuminata di notte. Il contrasto limitato rende facile la scansione dei casi di studio lunghi, soprattutto con una forte gerarchia tipografica. Abbinare con un caldo neutro come la sabbia per mantenere la pagina troppo fresca. Suggerimento: utilizzare il grigio chiaro per gli sfondi delle sezioni in modo che immagini e screenshot saltino fuori.

Immagine Esempio di inkbound minimal generato utilizzando media.io

7) Crepuscolo costiero

esagonale:#0e2538#163b55#2e607a#7b8f9e#e9f0f4

umore:Fresco, arioso, costiero

Migliore per:Poster di viaggio e guide di destinazione

L'aria del mare e i blues del tramonto sbiadimento portano una calma brezzosa alla pagina. Queste combinazioni di colori grigio blu scuro funzionano magnificamente per la grafica di viaggio, dove chiarezza e umore devono convivere. Abbinalo al beige sabbioso o alla pesca illuminata dal sole per un tocco di calore e nostalgia. Suggerimento: mantenere il tono più leggero come sfondo per preservare quella sensazione di cielo aperto.

Esempio di immagine di crepuscolo costiero generato utilizzando media.io

8) Fiore di grafite

esagonale:#2a2d33#3b3f48#2b4a66#6a8aa6#e7edf2

umore:moody, morbido, artistico

Migliore per:Illustrazioni botaniche e cancelleria

La grafite fumosa con dolci petali blu sembra poetica e leggermente misteriosa. I neutri più scuri aggiungono profondità, mentre il riflesso arioso impedisce ai fiori di diventare pesanti. Abbinare con texture di carta malva o crema per un finale romantico. Suggerimento: utilizzare il blu medio per il lavoro in linea in modo che il tono più scuro possa rimanere riservato alle ombre.

Esempio di immagine di fiore di grafite generato utilizzando media.io

9) Progetti in acciaio

esagonale:#101826#20314a#325070#6d7e8c#c9d1d9

umore:Tecnico, preciso, moderno

Migliore per:Dashboard dati e interfaccia utente di analisi

Blueprint blues e grigi acciaio sembrano nitidi, ordinati e silenziosamente futuristici. I passaggi del valore supportano grafici, griglie e stati di movimento senza rumore visivo. Abbinare con un singolo colore indicatore luminoso come il verde neon per avvisi e stati di successo. Suggerimento: mantenere le linee di griglia in grigio chiaro in modo che i dati, non l'impalcatura, attirino l'attenzione.

Immagine Esempio di progetti in acciaio generati utilizzando media.io

10) Notte dei musei

esagonale:#0a0f19#152033#223552#5f6d7c#e0e5ea

umore:Lusso, Drammatico, Curato

Migliore per:Volantini per mostre d'arte e promozioni per eventi

Le pareti della galleria fiochi e le cornici illuminate creano un'atmosfera drammatica e curata. I toni profondi rendono la tipografia premium, mentre il grigio pallido mantiene le date e i dettagli leggibili. Abbinare con un accento raffinato come champagne gold per una finitura di fascia alta. Suggerimento: utilizzare la tonalità più scura per lo sfondo e tirare il testo nel grigio più chiaro per un netto contrasto.

Esempio di immagine di Notte dei Musei generata utilizzando media.io

11) Marina nuvolosa

esagonale:#141b24#223044#2f4663#6f8294#f0f3f6

umore:Morbido, affidabile, equilibrato

Migliore per:Siti web di branding e servizi sanitari

Una base blu navy nuvolosa con grigi nebbiosi è rassicurante e calma. I toni sono abbastanza morbidi per i marchi di benessere, ma ancora strutturati per pagine e moduli di servizio. Abbinalo a un dolce verde o acqua per rafforzare un messaggio pulito e premuroso. Suggerimento: mantenere il grigio medio per i pulsanti secondari e il testo di aiuto in modo che le azioni primarie si distinguano.

Esempio di immagine di clouded navy generato utilizzando media.io

12) Chic industriale

esagonale:#23272f#2d3440#384659#5b6f86#b9c3cc

umore:Aggressivo, moderno, utilitario

Migliore per:Imballaggio del prodotto per la toelettatura degli uomini

I grigi metallici opachi e i bordi blu scuro sembrano audaci, puliti e utilitari. La tavolozza si adatta alle etichette minimaliste, lasciando che la tipografia e le finiture facciano il sollevamento pesante. Utilizzare un caldo foglio metallico o una texture sottile per aggiungere contrasto tattile. Suggerimento: stampare il tono più scuro come sfondo ricco e mantenere il grigio chiaro per gli ingredienti e piccoli testi legali.

Esempio di immagine di chic industriale generato utilizzando media.io

13) Osservatorio tranquillo

esagonale:#0c1624#16263b#27415f#6b7f95#d9e2ea

umore:Premuroso, scientifico, sereno

Migliore per:Infografie educative e blog scientifici

I blu del cielo notturno con i grigi misurati evocano un osservatorio tranquillo e una curiosità concentrata. Il contrasto funziona bene per diagrammi, grafici e letture lunghe in cui la chiarezza è la chiave. Come uno schema di colori grigio blu scuro, si abbina bene con un piccolo tocco di giallo per i punti salienti e le annotazioni. Suggerimento: mantenere le intestazioni nella tonalità più profonda e usare il grigio pallido per aprire le sezioni dense.

Esempio di immagine di osservatorio silenzioso generato utilizzando media.io

14) Giornata lavorativa nordica

esagonale:#2b3138#3a4754#1f3b57#6c7d8a#f3f5f7

umore:Scandinavo, ordinato, pratico

Migliore per:Produttività app UI e elenchi di cose da fare

I neutri nordici puliti con un ancoraggio blu intenso si sentono organizzati e tranquillamente motivanti. Le carte arrotondate e le semplici icone sembrano particolarmente nitide sullo sfondo pallido. Questa tavolozza di colori grigio blu scuro funziona meglio quando si limita l'uso del colore a stati come Attivo, Fatto e In ritardo. Suggerimento: assegna il blu più scuro all'azione primaria, quindi lascia che i grigi gestiscano la struttura e la spaziatura.

Esempio di immagine di nordic workday generato utilizzando media.io

15) Lavanda a carbone

esagonale:#2a2a31#3a3b46#2b365f#8a8faa#f6f4f8

umore:Morbido, elegante, leggermente romantico

Migliore per:Inviti di nozze e cancelleria formale

Le ombre a carbone con una luce colorata lavanda sembrano formali ma delicate. I neutri freddi mantengono la tipografia nitida, mentre i morbidi highlight aggiungono una finitura da sogno simile alla carta. Abbinare con stock bianco perla e un tocco di foglio argento per un look raffinato. Suggerimento: impostare il testo del corpo nel carbone e utilizzare il grigio lavanda solo per linee ornamentali o monogrammi.

Esempio di immagine di carbone lavanda generato utilizzando media.io

16) Pendolarismo piovoso

esagonale:#1f232b#2c3441#3b4b5f#6f7f8e#dde2e7

umore:moody, Quotidiano, Terrestre

Migliore per:streetwear Lookbook e post social

I grigi della pavimentazione bagnata e i blu dei pendolari sembrano reali, strutturati e moderni. I toni medi sono perfetti per sovrapposizioni sulle foto, mantenendo le didascalie leggibili senza blocchi duri. Abbinare con un accento audace come safety orange per l'energia streetwear. Suggerimento: utilizzare il grigio chiaro per lo spazio negativo in modo che la tavolozza rimanga traspirante sul cellulare.

Immagine Esempio di tragitto piovoso generato utilizzando media.io

17) Metropolitana di mare profondo

esagonale:#081a2a#0f2e46#1d4d63#4f6d7a#b9d0d8

umore:Fresco, moderno, energico

Migliore per:Pubblicità dei prodotti tecnologici e pagine di lancio delle app

Il blu mare profondo con un accento brillante e acquoso si sente elegante e veloce. La gamma supporta titoli in grassetto, accenti sfumati e profondità sottile nelle carte. Abbinare con spazio bianco e un singolo accento al neon per una moderna atmosfera tecnologica. Suggerimento: utilizzare il blu-grigio chiaro per gli effetti di luminosità e separatori invece del bianco puro.

Esempio di immagine di deep sea metro generato utilizzando media.io

18) Zaffiro fumoso

esagonale:#1c1f28#2a3240#1e3a68#3d6a9a#cfd9e6

umore:audace, lussuoso, notturno

Migliore per:branding di gioielli e imballaggi premium

Smoky shadows con blu zaffiro si sentono lussuosi e pronti per la notte. Queste combinazioni di colori grigio blu scuro sembrano particolarmente ricche su carte opache con lucentezza spot sui loghi. Abbinare con metalli caldi come oro o bronzo per rendere il blues sentire gioiello-tono. Consiglio: mantenere la tonalità più chiara per l'imballaggio interno e le informazioni sul prodotto in modo che si legge in modo pulito.

Esempio di immagine di smoky sapphire generato utilizzando media.io

19) Nebbia e fiordo

esagonale:#0f1a24#1e2c39#314453#6f8594#dfe8ee

umore:nebbioso, naturale, contemplativo

Migliore per:Linee guida e cataloghi del marchio outdoor

L'aria nebbiosa del fiordo e l'acqua di ardesia creano una calma naturale e contemplativa. La tavolozza sembra outdoorsy senza inclinarsi troppo rustico, rendendolo ottimo per i marchi di attrezzature moderne. Abbinalo al verde muschio o all'argilla per riecheggiare il terreno e mantenere la storia a terra. Suggerimento: utilizzare il tono foggy light per gli sfondi delle pagine per mantenere una sensazione fresca e aperta.

Esempio di immagine di fog & fjord generato utilizzando media.io

20) Cruscotto turno notturno

esagonale:#0d1420#16233a#223a5a#3c5a7a#b6c2cf

umore:Focalizzato, ad alto contrasto, tecnico

Migliore per:Interfaccia utente del dashboard in modalità scura

Il blues della sala di controllo a tarda notte sembra focalizzato e ad alto contrasto senza sembrare duro. La base profonda supporta i layout in modalità scura, mentre l'evidenziazione fresca rende grafici e interruttori facili da individuare. Abbinare con un accento moderato come il ciano per stati attivi e avvertimenti. Consiglio: mantenere le superfici grandi nei due toni più scuri e utilizzare la tonalità più chiara solo per i numeri chiave e le etichette.

Esempio di immagine di nightshift dashboard generato utilizzando media.io

Quali colori vanno bene con il grigio blu scuro?

I metalli caldi e i neutri caldi sono il modo più veloce per rendere il grigio blu scuro premium: pensa all'oro champagne, all'ottone, al rame, alla crema o alla sabbia. Contrabilanciano la base fresca e impediscono al look di sembrare troppo clinico.

Per un contrasto moderno, abbinare il grigio blu scuro con accenti brillanti e saturi come corallo, lime, ciano o arancione di sicurezza. Utilizzare gli accenti con parsimonia su CTA, tag o punti dati chiave in modo che l'interfaccia rimanga calma.

Se vuoi un umore naturale, aggiungi verdure terrose (muschio, salvia) o toni argillosi. Queste combinazioni mantengono la tavolozza a terra e funzionano particolarmente bene per marchi outdoor, wellness e lifestyle.

Come utilizzare una tavolozza di colori grigio blu scuro nei disegni reali

Inizia assegnando ruoli: un grigio chiaro per gli sfondi, un grigio medio per i bordi e l'interfaccia utente secondaria e un blu scuro per le intestazioni o la navigazione. Questo mantiene la gerarchia coerente tra le pagine, le diapositive o i layout di stampa.

Mantenere la leggibilità testando il contrasto in anticipo, soprattutto in modalità scura. Riserva il blu navy/carbone più scuro per superfici di grandi dimensioni o tipo di titolo, e mantenere la copia del corpo su grigi più chiari per evitare fatica oculare.

Infine, scegli un colore di accento e attenerti ad esso per l'enfasi (pulsanti primari, evidenziazioni, avvisi). Con il grigio blu scuro, un singolo accento ben scelto spesso fa più di più di più colori concorrenti.

Crea visuali grigio blu scuro con l'intelligenza artificiale

Vuoi vedere come appare la tua tavolozza di colori grigio blu scuro in scene reali, come cruscotti, imballaggi, poster o interni? La generazione di immagini simulate rapide ti aiuta a convalidare il contrasto, l'umore e l'adattamento del marchio prima di impegnarti.

Con Media.io Text-to-Image, puoi trasformare un semplice prompt in concetti coerenti con la tavolozza per schermi UI, grafica di marketing o layout pronti per la stampa. È un modo veloce per esplorare le variazioni senza ricostruire i disegni da zero.

Scegli uno dei suggerimenti sopra (o scrivi il tuo), genera alcune opzioni, quindi perfeziona il vincitore regolando l'illuminazione, i materiali e i colori dell'accento.

Prossimo: Palette di colori retrò anni '90