20 abbinamenti di colori blu medio con codici HEX

Il blu medio si posiziona perfettamente tra la calma e la sicurezza, risultando incredibilmente facile da utilizzare in interfacce utente, branding e stampa. Trasmette affidabilità come il blu classico, ma appare più fresco e moderno del blu navy scuro.

Di seguito trovi oltre 20 idee di palette di colori blu medio con codici HEX, oltre a prompt AI pronti da copiare per generare visual coerenti per mockup, poster e moodboard del brand.

Perché le palette blu medio funzionano così bene

Il blu medio è versatile perché bilancia tono emotivo e leggibilità. Trasmette affidabilità ed è "amichevole per la tecnologia", ma mantiene una luminosità sufficiente per essere invitante nelle interfacce moderne e nelle pagine di marketing.

Si abbina perfettamente sia con neutri freddi (bianco, ardesia, blu-grigio) sia con accenti caldi (ambra, corallo, terracotta). Questo ti permette di creare contrasto per CTA o evidenziazioni senza opporsi al colore di base.

In stampa, il blu medio tende a mantenere il suo carattere su diversi tipi di carta e illuminazione. Con i neutri giusti di supporto, assicura layout puliti e professionali, evitando il senso di pesantezza dei blu più scuri.

20+ Idee di Palette Blu Medio (con Codici HEX)

1) Cruscotto Costiero

HEX: #2f6fed #1b2a41 #eaf2ff #2bd4c7 #f6b73c

Mood: pulito, ventilato, moderno

Ideale per: cruscotto ui saas 2d

Aria marina pulita e schermi illuminati dal sole vengono subito in mente, con blu sicuri bilanciati da bianco delicato. Perfetto per dashboard di analytics, strumenti fintech e pagine prodotto che richiedono fiducia senza risultare freddi. Usa il teal come stato attivo e l’ambra come highlight mirato per numeri chiave. Suggerimento d’uso: riserva il navy più scuro per testi e sidebar, in modo da mantenere un contrasto forte e accessibile.

Esempio immagine del cruscotto costiero generato con media.io

Media.io

Media.io è uno studio AI online per creare e modificare video, immagini e audio direttamente nel browser.

Provalo gratis subito

2) Marina Neon

HEX: #3a7bd5 #0b1020 #ff4fd8 #00e6ff #f5f7ff

Mood: elettrico, notturno, alto contrasto

Ideale per: design poster evento musicale

Le luci del porto elettrico brillano contro la notte profonda, mescolando blu nitido con tocchi neon. Perfetto per poster, copertine album o grafica social dove il contrasto deve colpire immediatamente. Mantieni cyan e magenta come accenti nei titoli e lascia il bianco delicato intorno alla tipografia. Suggerimento d’uso: aggiungi una leggera texture grain per ammorbidire i contorni neon senza perdere energia.

Esempio immagine di marina neon generato con media.io

3) Denim e Duna

HEX: #2d6cdf #6b7a90 #f2e6d8 #c97c5d #2a2a2a

Mood: radicato, casual, equilibrio caldo-freddo

Ideale per: landing page brand lifestyle

Il denim usurato e la sabbia cotta dal sole creano una sensazione rilassata e affidabile. Queste combinazioni di blu medio risplendono nei siti lifestyle, lookbook ed editorial che vogliono calore senza perdere chiarezza. Usa la crema duna per le sezioni di sfondo e la terracotta per pulsanti o badge. Suggerimento d’uso: mantieni gli heading in quasi nero e il testo principale in ardesia per ritmo premium e leggibile.

Esempio immagine di denim e dune generato con media.io

4) Frutteto Zaffiro

HEX: #356ae6 #15304a #a8e6a3 #ffffff #ff6b6b

Mood: fresco, ottimista, giocoso

Ideale per: schermate onboarding app benessere

Frutta fresca e cieli limpidi creano un tono luminoso e incoraggiante. Ideale per onboarding wellness, tracker di abitudini o SaaS allegri dove la positività conta. Lascia il verde per stati di successo e il corallo per attirare attenzione sulle azioni primarie. Suggerimento d’uso: mantieni gli sfondi grandi bianchi e porta il blu in intestazioni e forme illustrative, evitando affaticamento visivo.

Esempio immagine di frutteto zaffiro generato con media.io

5) Fiordaliso Nuvoloso

HEX: #4a86e8 #d9e6ff #f7f8fb #9aa4b2 #7b5cff

Mood: morbido, arioso, tecnologia delicata

Ideale per: slide pitch deck startup

Coperture di nuvole leggere e tocchi di fiordaliso creano un’atmosfera calma, concentrata e un po’ futuristica. Ottima scelta per pitch deck, report e slide esplicative che devono risultare leggibili in proiezione. Usa il lavanda come secondo highlight per note e divisori di sezioni. Suggerimento d’uso: mantieni i grafici su due toni di blu e riserva il viola per la serie dati da ricordare.

Esempio immagine di fiordaliso nuvoloso generato con media.io

6) Piscina di Mezzanotte

HEX: #2a66d9 #071a2b #1f9bd1 #e6eef7 #c8a2ff

Mood: cupo, elegante, notturno

Ideale per: banner canale gaming

Acqua scura e luci riflesse danno a questa palette un aspetto elegante e da notte fonda. Ideale per banner gaming, overlay streaming e header eroici che richiedono profondità. Usa il cyan per elementi interattivi e grigio-blu pallido per blocchi di testo leggibile. Suggerimento d’uso: aggiungi una sfumatura sottile da navy a blu dietro il logo per dimensione immediata senza creare disordine.

Esempio immagine di piscina di mezzanotte generato con media.io

7) Blueprint Elettrico

HEX: #2f76ff #0b1f3b #15d3ff #f4f8ff #ffcc33

Mood: tecnico, energico, preciso

Ideale per: sito documentazione developer

Linee blueprint e LED brillanti creano un’atmosfera tecnica e sicura. Questo mix è ottimo per siti di documentazione, portali API e knowledge base dove la navigazione deve essere immediatamente chiara. Lascia il cyan per i link e il giallo per avvisi o note importanti. Suggerimento d’uso: mantieni i blocchi di codice su navy scuro e usa lo sfondo chiaro per comfort nella lettura lunga.

Esempio immagine di blueprint elettrico generato con media.io

8) Pastello Bluebird

HEX: #5b8dff #ffe6f1 #fff8e1 #7de2d1 #2e3a59

Mood: dolce, amichevole, accogliente

Ideale per: ui app apprendimento bambini

Morbidezza zucchero filato, con una spinta bluebird brillante, trasmette cordialità e motivazione. Ideale per interfacce di apprendimento bambini, micro-siti giocosi o email allegre. Abbina il mint per stati di avanzamento e il navy per etichette, evitando testi sbiaditi. Suggerimento d’uso: utilizza grandi blocchi colorati e forme arrotondate, limitando icone dettagliate, così la palette resta calma.

Esempio immagine di pastello bluebird generato con media.io

9) Transito Urbano

HEX: #2e6be0 #101820 #9fb3c8 #f2f4f7 #ff5a1f

Mood: strutturato, metropolitano, accenti decisi

Ideale per:sistema di segnaletica orientativa

Linee della città, mappe delle stazioni e una tipografia pulita guidano qui l'atmosfera. Questa palette di blu medio è una solida soluzione per la segnaletica orientativa, cartellonistica pubblica e layout ricchi di informazioni che devono restare leggibili a distanza. Abbina l'arancione come accento direzionale e mantieni i grigi per i dati secondari. Consiglio d'uso: testa il contrasto sui materiali stampati sotto luci forti per assicurarti che blu navy e blu restino distinti.

Esempio di immagine di trasporto urbano generata con media.io

10) Piastrella in ceramica

HEX:#3b74d8 #f9f4ee #2f3d4a #7aa6b2 #d98c6a

Mood:artigianale, mediterraneo, accogliente

Ideale per:design di menù per ristorante

Mattonelle dipinte a mano e argilla calda donano una sensazione artigianale e ospitale. Funziona per menù, branding di caffè e packaging che vuole tradizione con un tocco moderno. Usa il crema per ampie superfici, poi inserisci il blu per intestazioni di sezione e bordi decorativi. Consiglio d'uso: limita l'accento terracotta a piccoli elementi come puntini dei prezzi o icone così la palette resta raffinata.

Esempio di immagine di piastrella in ceramica generata con media.io

11) Conferenza tecnologica

HEX:#2f6fe6 #0f172a #e2e8f0 #22c55e #a78bfa

Mood:sicuro, contemporaneo, intelligente

Ideale per:header sito conferenza

Luci di scena e tipografia nitida creano un tono sicuro e moderno. È ideale per siti di conferenze, pagine di relatori e funnel di registrazione che richiedono chiarezza e slancio. Abbina il verde alle CTA e usa il viola per evidenziazioni secondarie come tag o etichette delle piste. Consiglio d'uso: mantieni lo sfondo dell’header scuro e usa il grigio chiaro per le sezioni di contenuto per evitare una sensazione di pagina pesante.

Esempio di immagine di conferenza tecnologica generata con media.io

12) Poster Skyline

HEX:#2d6ae3 #f8fafc #111827 #94a3b8 #f97316

Mood:audace, grafico, contemporaneo

Ideale per:poster da viaggio moderno

Una silhouette nitida dello skyline su un cielo luminoso trasmette grinta e stile grafico. Usalo per poster da viaggio, guide cittadine e annunci stampati che necessitano di un tocco contemporaneo. Abbina l’arancione per un singolo elemento focale come un sole, etichetta o linea del percorso. Consiglio d'uso: mantieni le ombre al minimo e affidati a forme piatte in modo che il blu resti il protagonista della composizione.

Esempio di immagine di skyline poster generata con media.io

13) Oceanic Minimal

HEX:#3a80e6 #ffffff #e6eef8 #2b3a55 #00b3c6

Mood:minimal, calmo, raffinato

Ideale per:sistema d’identità visiva

Acque luminose e spazi bianchi fanno sembrare tutto raffinato e degno di fiducia. Questo set è adatto a sistemi d'identità, cancelleria e siti dal design essenziale dove la moderazione fa parte del marchio. Abbina il teal per momenti distintivi come icone, punti elenco o hover di link. Consiglio d'uso: limita il blu a una singola tonalità primaria tra i materiali così l'aspetto rimane coerente dal web alla stampa.

Esempio di immagine oceanic minimal generata con media.io

14) Arcade retrò

HEX:#2f6de0 #1a1033 #ff3d81 #20e3b2 #fef08a

Mood:retrò, giocoso, grintoso

Ideale per:pubblicità promo gioco mobile

Bagliore da sala giochi e nostalgia pixel rendono questa palette divertente e veloce. È perfetto per pubblicità di giochi mobile, promo social e banner grintosi dove il colore deve parlare da sé. Usa il rosa per i power-up e il verde menta per bottoni secondari o badge. Consiglio d'uso: mantieni gli sfondi viola scuro così blu e colori vivaci risaltano senza creare confusione.

Esempio di immagine arcade retrò generata con media.io

15) Sport invernali

HEX:#2e6fe8 #0b1d39 #dbeafe #ffffff #ff2d55

Mood:nitido, atletico, energico

Ideale per:pubblicità prodotto sportivo

Aria fredda e movimento veloce emergono dai blu nitidi e dai bianchi puliti. Usalo per spot di abbigliamento sportivo, landing page di performance e highlights di prodotto audaci. Abbina il rosa acceso come colore CTA energico e mantieni l'azzurro per spaziature ariose. Consiglio d'uso: mantieni illuminazione neutra sui prodotti così il blu resta fedele e non vira verso il teal.

Esempio di immagine sport invernali generata con media.io

16) Editoriale Biblioteca

HEX:#3b78e0 #0f2a44 #f3f4f6 #c7d2fe #b45309

Mood:riflessivo, accademico, raffinato

Ideale per:layout editoriale rivista

Aule silenziose e inchiostro su carta donano a questa palette una sensazione editoriale e riflessiva. Funziona bene per doppie pagine di riviste, report approfonditi e portfolio testuali con molto testo. Abbina il marrone caldo per citazioni o marker di sezione per evitare l’effetto monocorde. Consiglio d'uso: mantieni i testi in blu navy profondo e usa margini grigio chiaro per incorniciare i contenuti con pulizia.

Esempio di immagine editoriale biblioteca generata con media.io

17) Botanical Breeze

HEX:#2f6ee6 #e7f7ef #2f855a #fef3c7 #1f2937

Mood:fresco, naturale, energizzante

Ideale per:illustrazione botanica ad acquerello

Una fresca brezza tra le fronde del giardino trasmette leggerezza, naturalezza e sollievo. Queste combinazioni di blu medio sono perfette per illustrazioni benessere, packaging eco e visual primaverili. Abbina il crema morbido per gli spazi negativi e mantieni il carbone per didascalie ed etichette. Consiglio d'uso: con l'acquerello, lascia che il blu sfumi nei bordi menta per transizioni graduali, evitando contorni netti.

Esempio di immagine botanical breeze generata con media.io

18) Studio orologi di lusso

HEX:#2f6fe0 #0a0f1a #d1d5db #ffffff #cfa34a

Mood:lusso, drammatico, ad alto contrasto

Ideale per:scatto prodotto orologio di lusso

Ombre profonde e metalli lucidi donano un mood premium e cinematografico. È ideale per pagine prodotto di lusso, adv di gioielli e confezioni esclusive dove il contrasto trasmette qualità. Abbina l'oro come highlight dosato e mantieni la maggior parte delle superfici in nero, bianco e grigio acciaio. Consiglio d'uso: usa il blu come luce di contorno o gradiente di sfondo così trasmette eleganza più che sportività.

Esempio di immagine studio orologi lusso generata con media.io

19) Inbox Clarity

HEX:#3a7ee6 #f8fafc #e2e8f0 #334155 #f59e0b

Mood:chiaro, efficiente, amichevole

Ideale per:template newsletter email

Titoli chiari e sezioni ordinate trasmettono la sensazione di una casella ben organizzata. Questo set è ottimo per newsletter, email di aggiornamento prodotto e template di annunci che devono essere leggibili su ogni dispositivo. Abbina l’ambra per piccole enfasi come etichette, tag o un unico bottone. Consiglio d'uso: mantieni i testi lunghi su bianco e il blu medio solo per la gerarchia, non per grandi aree.

Esempio di immagine inbox clarity generata con media.io

20) Catalogo museo

HEX:#2d6de6 #0f172a #f1f5f9 #64748b #ef4444

Mood:curato, silenzioso, autorevole

Ideale per:copertina catalogo mostra

Gallerie selezionate e didascalie nitide creano una sensazione di autorevolezza e tranquillità. È una scelta forte per copertine cataloghi, programmi museo ed eventi culturali. Abbina il rosso per un unico elemento in evidenza come data o titolo mostra. Consiglio d'uso: mantieni la palette principalmente neutra, poi usa il blu per incorniciare le immagini e guidare la lettura.

Esempio di immagine catalogo museo generata con media.io

21) Night Market

HEX:#2f6be6 #111827 #f472b6 #fbbf24 #e5e7eb

Mood:vibrante, urbano, accogliente

Ideale per:volantino street food

Luci, insegne e snack notturni trasmettono vivacità e accoglienza. Queste combinazioni di blu medio sono ideali per flyer, grafiche per eventi pop-up e social post che vogliono energia ma senza caos. Abbina il giallo per prezzi e highlight, e usa il rosa per icone giocose o titoli. Consiglio d'uso: mantieni gli sfondi scuri e limita gli accenti vivaci a due aree chiave così il messaggio resta leggibile.

Esempio di immagine night market generata con media.io

22) Web gradiente soffice

HEX:#3a7ae6 #b9d3ff #ffffff #2b3448 #ff7a59

Mood:caldo, moderno, accogliente

Ideale per:hero homepage marketing

Gradienti morbidi e contrasti amichevoli donano alla pagina un aspetto caldo e moderno. Usalo per hero di marketing, sezioni highlight e pagine d’iscrizione che vogliono dare una buona prima impressione. Abbina il corallo per i botttoni principali e mantieni l'ardesia scura per navigazione e titoli. Consiglio d'uso: applica l’azzurro chiaro come grande gradiente di sfondo e lascia il blu principale per componenti UI chiave.

Esempio di immagine web gradiente soffice generata con media.io

Quali colori si abbinano bene al blu medio?

Il blu medio si abbina senza sforzo a neutri puliti come bianco, bianco sporco e grigio-azzurro chiaro, che lo rendono arioso e leggibile. Per testo e struttura, navy o carbone profondi mantengono un contrasto deciso senza risultare aggressivi.

Per gli accenti, toni caldi come ambra, corallo e arancione creano punti focali immediati per bottoni, prezzi e badge. Se preferisci un contrasto più freddo, teal/ciano aggiunge energia “attiva” restando nella stessa famiglia oceanica.

Per un tocco più distintivo, prova violetto o lavanda come highlight secondari. Aggiunge una vibrazione moderna e un po’ futuristica pur restando raffinato con blu medio.

Come usare una palette blu medio nei progetti reali

Inizia decidendo quale ruolo gioca il blu medio nel tuo sistema: colore principale del brand, azione primaria UI o cornice di sfondo. Poi usa i neutri per la maggior parte delle superfici così il blu appare intenzionale, non eccessivo.

Riserva un solo accento caldo per “momenti d’attenzione” come bottoni CTA, dati chiave o etichette. Limitare gli accenti aiuta a mantenere la gerarchia chiara e la palette ordinata.

Infine, testa il contrasto fin dall'inizio, soprattutto per testi piccoli e stati UI (hover, attivo, disabilitato). Il blu medio può apparire diverso su vari schermi e in stampa, quindi un rapido controllo mantiene il tuo design coerente.

Crea visual di palette blu medio con l’AI

Se vuoi vedere queste palette in azione, genera mockup e grafiche coordinate con l’IA. I prompt sono inclusi sotto ogni palette così puoi creare velocemente visual coerenti per presentazioni, landing page e poster.

Per risultati ottimali, mantieni gli stessi cinque codici HEX in ogni prompt, specifica lo stile di layout (UI 2D, poster, copertina catalogo) e fissa il rapporto d’aspetto con il --ar setting.

Quando trovi un look che ti piace, produci un piccolo set di varianti (composizioni diverse, stessa palette) per costruire un brand o una campagna coesa più rapidamente.

Successivo: Palette di colori verde giungla