Palette Giallo Blu Scuro: Codici HEX e Consigli per Abbinamenti Colori

Il giallo e il blu scuro sono uno degli abbinamenti ad alto contrasto più chiari che puoi usare: abbastanza audace da attirare l'attenzione, ma abbastanza strutturato da sentirti professionale.

Nel branding, nell'interfaccia utente e nella stampa, il blu intenso apporta fiducia e leggibilità, mentre il giallo aggiunge energia ai punti salienti, agli inviti all'azione e alle informazioni chiave.

Perché le combinazioni blu scuro e giallo funzionano così bene

Le combinazioni blu scuro e giallo funzionano perché bilanciano temperatura e contrasto: il blu sembra stabile e profondo, mentre il giallo sembra luminoso e immediato. Insieme, creano una gerarchia visiva naturale senza la necessità di molti colori extra.

Il blu scuro fornisce anche una base affidabile per la tipografia e i componenti dell'interfaccia utente, soprattutto quando hai bisogno di leggibilità e di un tono "affidabile". Il giallo diventa quindi l'accento perfetto per gli highlight, le notifiche e le richieste all'azione.

Quando usato con moderazione, l'abbinamento di blu scuro e giallo può sembrare premium piuttosto che forte, soprattutto se si aggiunge un morbido neutro (crema, bianco spento o grigio) per dare all'occhio un posto di riposo.

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

1) Porto soleggiato

esagonale:#0b1f3b#123a63#f6c445#fff2c6#2f5f8f

umore:Fresco, nautico, ottimista

Migliore per:branding di viaggio e banner di eroi

Fresco e nautico, si sente come il sole presto su un molo tranquillo con aria fresca e acqua limpida. Usa i toni navy per intestazioni e navigazione, quindi lascia che il giallo caldo evidenzi i CTA e i badge chiave. Abbinalo a un sacco di spazio bianco per un look pulito e costiero. Suggerimento: mantenere il giallo più brillante a piccoli elementi ad alto impatto in modo che si legge premium, non forte.

Esempio di immagine di sunlit harbor 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) Senape di mezzanotte

esagonale:#071a2e#0f2d4a#d4a017#f1e7c7#3b6a93

umore:moody, raffinato, ad alto contrasto

Migliore per:Imballaggi premium e annunci sui prodotti

Moody e raffinato, ricorda stanze illuminate da candele e ottone lucido contro le pareti di mezzanotte. Come combinazione di colori blu scuro e giallo, eccelle quando il blu più scuro porta lo sfondo e la senape funziona come un accento controllato. Aggiungi la crema calda per la sala respiratoria nelle etichette e nei pannelli degli ingredienti. Suggerimento: utilizzare una superficie opaca blu intenso e un singolo highlight di senape lucido per rendere il design tattile.

Esempio di immagine di midnight mustard generato utilizzando media.io

3) Faro nautico

esagonale:#0a2440#1b4f72#ffd24a#f7f9fc#2d2a32

umore:Chiaro, sicuro di sé, energico

Migliore per:Grafica sportiva e merch di squadra

Chiaro e sicuro, sembra un raggio di faro che taglia attraverso la nebbia marina. Mantieni il giallo brillante per numeri, strisce e chiamate all'azione, mentre il blu intenso ancora i capi di base. Il quasi bianco supporta la leggibilità per piccoli testi e dettagli di cucitura. Suggerimento: riserva il carbone come colore di contorno per affilare i bordi senza aggiungere tonalità extra.

Esempio di immagine di faro nautico generato utilizzando media.io

4) Faretto del museo

esagonale:#0d1b2a#1b263b#f2b705#e0e1dd#415a77

umore:Drammatico, curato, elegante

Migliore per:Poster e copertine editoriali della mostra

Drammatico e curato, evoca sale di gallerie dove un caldo riflettore colpisce una singola opera d'arte. Questa tavolozza di colori giallo blu scuro funziona meglio quando i blu profondi formano campi grandi e silenziosi e il tono dorato segna titoli o date. Usa il grigio morbido come spazio negativo simile a carta per didascalie e crediti. Suggerimento: impostare il giallo come una barra verticale stretta per creare una linea focale immediata.

Esempio di immagine di Museo spotlight generato utilizzando media.io

5) Taxiway costiero

esagonale:#082032#2c394b#ffcc29#f4f4f4#334756

umore:Moderno, strutturato, assertivo

Migliore per:Interfaccia utente del dashboard e applicazioni pesanti di dati

Moderno e strutturato, suggerisce segnaletica di pista e segnaletica direzionale nitida. Utilizzare il blu più scuro per le barre laterali e le tabelle dati, quindi fare affidamento sul giallo brillante per gli stati attivi e gli avvisi. Il bianco spesso mantiene i grafici leggibili e impedisce che l'interfaccia sembri pesante. Suggerimento: limitare il giallo a un ruolo dell'interfaccia utente, come i pulsanti primari, in modo che gli utenti imparino immediatamente il modello.

Esempio di immagine di coastal taxiway generato utilizzando media.io

6) Denim Narciso

esagonale:#102a43#243b53#fbd34d#fff8db#486581

umore:Amichevole, casual, Soleggiato

Migliore per:Modelli social e blog di lifestyle

Amichevole e casual, sembra denim con un narciso infilato in una tasca. Lasciate che il blu medio gestisca il testo del corpo e le cornici, mentre il giallo morbido solleva i punti salienti e gli adesivi. La crema pallida mantiene l'aspetto generale arioso per lunghe letture e post di carosello. Suggerimento: Aggiungi forme sottili arrotondate nel tono più leggero per ammorbidire i bordi duri su layout occupati.

Esempio di immagine di denim daffodil generato utilizzando media.io

7) Sicurezza industriale

esagonale:#001d3d#003566#ffc300#e5e5e5#000814

umore:Audace, utilitario, pronto per l'avvertimento

Migliore per:Marchio di costruzione e segnaletica di sicurezza

Audace e utilitario, canalizza il nastro di rischio contro l'acciaio e le luci di lavoro notturne. Utilizzare il quasi nero e il blu intenso per il massimo contrasto sugli sfondi dei segni, quindi applicare il giallo brillante alle icone e alle istruzioni chiave. Il grigio neutro mantiene le note secondarie leggibili senza competere. Suggerimento: aumentare leggermente la spaziatura tra le lettere sul testo giallo rispetto al blu scuro per ridurre le vibrazioni e migliorare la leggibilità a distanza.

Immagine Esempio di sicurezza industriale generato utilizzando media.io

8) Limonata eclissi

esagonale:#0b1320#1c2541#ffdd57#f6f3ea#3a506b

umore:Cinematografico, liscio, leggermente giocoso

Migliore per:Volantini per eventi e promozioni musicali

Cinematografico e liscio, sembra un bagliore di eclissi solare con un tocco di limonata frizzante. Costruisci il volantino su blues profondi per una base per il cielo notturno, quindi lascia che il giallo limone metta in risalto la formazione e il collegamento dei biglietti. Il bianco scuro cremoso mantiene i testi più piccoli nitidi senza diventare nitidi. Suggerimento: utilizzare un morbido gradiente tra i due blu per aggiungere profondità pur rimanendo sul marchio.

Esempio di immagine di eclipse lemonade generato utilizzando media.io

9) Laboratorio reale

esagonale:#0a1f44#1f3c88#f7c948#f0f4ff#2a6f97

umore:Intelligente, inventivo, ottimista

Migliore per:Pagine di destinazione e sezioni di funzionalità

Intelligente e inventivo, sembra un laboratorio luminoso in cui le idee si inseriscono al loro posto. Queste combinazioni di colori giallo e blu scuro brillano sulle landing page: utilizzare il blu intenso per struttura e credibilità, e applicare il giallo con parsimonia per indirizzare l'attenzione sul valore del prodotto. Il bianco-blu pallido rende i blocchi di contenuto leggeri e scansionabili. Suggerimento: mantenere le icone in un blu coerente e riservare il giallo solo per gli stati interattivi.

Esempio di immagine di laboratorio reale generata con media.io

10) Calendula Tempestosa

esagonale: #0b2545 #13315c #f9a826 #eef2f3 #1f7a8c

umore: avventuroso, costiero, sferzato dal vento

Migliore per: pubblicità e lookbook di attrezzatura outdoor

Avventuroso e sferzato dal vento, ricorda nuvole temporalesche che si stagliano su un orizzonte di calendula calda. Usa i blu più scuri per giacche, tipografia e titoli ad alto contrasto, quindi aggiungi l’arancione-giallo per tag e punti prezzo. Il bianco sporco freddo supporta i dettagli prodotto e le specifiche tecniche. Consiglio: mantieni il teal come accento minore per cuciture o piccoli elementi UI così la palette rimane coerente.

Esempio di immagine di calendula tempestosa generata con media.io

11) Bagliore Tramviario Urbano

esagonale: #0f172a #1e3a8a #fbbf24 #f8fafc #334155

umore: urbano, nitido, energico

Migliore per: segnaletica direzionale e grafica d’informazione pubblica

Urbano e nitido, ricorda le luci dei tram che si riflettono sul marciapiede bagnato di notte. I blu navy e ardesia profondi creano una solida gerarchia informativa, mentre il giallo ambra rende fermate e avvisi immediatamente visibili. Usa il quasi bianco per mappe ed etichette così i dettagli restano nitidi. Consiglio: applica il giallo solo a una famiglia di simboli, come le icone, per evitare affollamento visivo nei diagrammi complessi.

Esempio di immagine di bagliore tramviario urbano generata con media.io

12) Picnic all’Ora Blu

esagonale: #101935 #23395d #f2d95c #f7f3e3 #406e8e

umore: calmo, nostalgico, gentile

Migliore per: inviti di nozze e cartoleria

Calmo e nostalgico, richiama alla mente picnic al crepuscolo con luce di lanterne e risate soffuse. Usa il blu profondo per nomi e dettagli formali, e lascia che il giallo burroso compaia in bordi, motivi di sigilli in ceralacca o piccole floreali. La crema calda simile alla carta mantiene il tutto romantico e stampabile. Consiglio: scegli una carta testurizzata e tieni il giallo a copertura bassa per risultati eleganti con l’inchiostro.

Esempio di immagine di picnic all’ora blu generata con media.io

13) Cartoleria Vintage

esagonale: #0b2239 #2b4c7e #e8b339 #f3e9dc #6b7c93

umore: eredità, accademico, caldo

Migliore per: copertine di libri e set di cartoleria

Ereditario e accademico, richiama vecchi quaderni, timbri a inchiostro e strumenti da scrivania in ottone. I blu profondi si adattano a titoli e dorsi, mentre il giallo spento ricorda una lamina antica senza gridare. Usa la crema pergamena per ampi sfondi e mantieni il blu-grigio per il testo secondario. Consiglio: aggiungi un bordo sottile nel blu intermedio per incorniciare i layout e rafforzare il mood vintage.

Esempio di immagine di cartoleria vintage generata con media.io

14) Osservatorio Dorato

esagonale: #06121f #0b3c5d #f9c74f #f1faee #1d6a96

umore: curioso, cosmico, raffinato

Migliore per: poster scientifici e slide per conferenze

Curioso e cosmico, suggerisce carte stellari con un marker dorato caldo che traccia costellazioni. Usa il blu più scuro per sfondi e diagrammi, quindi applica il giallo per risultati chiave e callout. Il bianco sporco freddo supporta informazioni dense senza abbagliare. Consiglio: mantieni le griglie dei grafici nel blu medio così i dati gialli rimangono protagonisti.

Esempio di immagine di osservatorio dorato generata con media.io

15) Stemmi del Campus

esagonale: #0a1931 #185adb #ffc947 #f6f6f6 #2e3a59

umore: audace, universitario, energico

Migliore per: branding di club e poster universitari

Audace e universitario, ricorda stemmi, striscioni e luci da stadio brillanti. Questa palette di giallo e blu scuro è una scelta forte per il branding di organizzazioni studentesche che necessitano visibilità istantanea a distanza. Mantieni il blu reale per grandi forme e il giallo per titoli d’impatto, poi usa il grigio chiaro come base del poster. Consiglio: stampa prima una prova piccola, perché il blu reale può cambiare su carta non patinata.

Esempio di immagine di stemmi del campus generata con media.io

16) Insegne del Mercato Notturno

esagonale: #0b132b #1c2541 #f8c630 #eaeaea #5bc0be

umore: vivace, effetto neon, cittadino

Migliore per: menù da ristorante e carte promozionali

Vivace e cittadino, sembra di essere sotto insegne luminose in un mercato notturno movimentato. Usa i blu profondi per sfondi dei menù e riquadri fotografici, quindi il giallo sulle etichette prezzo e callout per scansione rapida. Il grigio chiaro mantiene il testo leggibile nelle sezioni fitte. Consiglio: usa il teal solo per piccoli marcatori, come livelli di spezie, per non competere col colore di evidenza principale.

Esempio di immagine di insegne del mercato notturno generata con media.io

17) Tela a Vela d’Autunno

esagonale: #0b2d39 #1d4e89 #f0b429 #fff3d6 #1a936f

umore: terroso, outdoor, sicuro

Migliore per: brand per campeggio e campagne stagionali

Terroso e sicuro, evoca tele di vela, aghi di pino e sole di fine stagione. I blu profondi creano solide basi per loghi e striscioni, mentre il giallo dorato aggiunge calore a badge e offerte a tempo. Usa la crema per sfondi ariosi e il verde come accenno naturale discreto. Consiglio: tieni il verde sotto il 10 percento del layout così la palette comunica prima di tutto blu-giallo.

Esempio di immagine di tela a vela d’autunno generata con media.io

18) Crepuscolo in Galleria

esagonale: #050a30 #1b2cc1 #fcbf49 #f5f5f5 #2d2d2a

umore: artistico, ad alta energia, moderno

Migliore per: branding per agenzie creative e copertine di reel

Artistico e ad alta energia, ricorda una inaugurazione di galleria con luci audaci e ombre nette. Il blu elettrico dà una spinta moderna, mentre il giallo caldo mantiene la composizione accogliente e umana. Usa il bianco per spazi di respiro e il carbone per dettagli tipografici minori. Consiglio: applica il blu più brillante solo a un elemento per frame, come un marchio, per non sopraffare l’accento giallo.

Esempio di immagine di crepuscolo in galleria generata con media.io

19) Classico Sportivo

esagonale: #0a2342 #2ca6a4 #f6bd60 #ffffff #1d3557

umore: pulito, sportivo, positivo

Migliore per: interfaccia app fitness e onboarding

Pulito e sportivo, trasmette la sensazione di divise fresche e coni da allenamento brillanti. Usa il blu più scuro per intestazioni e navigazione, quindi lascia che il giallo caldo segni progressi, tratti o premi. Il bianco mantiene l’interfaccia ariosa e facilita la scansione rapida. Consiglio: assegna il teal solo alle azioni secondarie, così gli obiettivi principali restano collegati all’accento giallo.

Esempio di immagine di classico sportivo generata con media.io

20) Lampada della Biblioteca Silenziosa

esagonale: #0b1d39 #1c3f60 #ffd166 #f6f1e9 #4f6d7a

umore: calmo, studioso, caldo

Migliore per: blog educativi e slide di corsi

Calmo e studioso, sembra una lampada da scrivania calda in una biblioteca silenziosa dopo l’orario. Queste combinazioni di colori giallo e blu scuro sono ottime per lezioni e tutorial perché il contrasto resta leggibile senza risultare aggressivo. Usa i blu profondi per struttura e titoli, quindi aggiungi il giallo con parsimonia per termini chiave e checkpoint. Consiglio: mantieni il testo lungo nel blu-grigio più morbido per ridurre l’affaticamento visivo su pagine lunghe.

Esempio di immagine di lampada della biblioteca silenziosa generata con media.io

Quali colori stanno bene con il giallo e il blu scuro?

I neutri sono la soluzione più semplice: bianco, crema e grigio chiaro mantengono la palette ariosa e aiutano sia il giallo che il blu scuro a restare leggibili. Per la stampa, un bianco sporco caldo può rendere il giallo più ricco e meno aggressivo.

Se hai bisogno di un terzo accento “colorato”, teal e verde acqua possono fare da ponte tra giallo e blu in modo costiero e sportivo. Il carbone o il quasi nero funzionano bene per contorni, ombre e testo piccolo senza introdurre un nuovo colore.

Per una direzione più premium, prova tonalità ispirate ai metalli come oro smorzato o ottone (come variante del giallo), più un blu ardesia freddo per superfici UI e grafici.

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

Inizia con il blu scuro come base: sfondi, titoli, navigazione o grandi forme. Questo crea struttura e dà intenzionalità al design invece che renderlo caotico.

Usa il giallo come faretto: pulsanti principali, numeri chiave, badge ed etichette importanti. Limitare il giallo a un solo ruolo principale (CTA, avvisi o evidenze) rende l’interfaccia più facile da imparare e il layout più facile da scansionare.

Aggiungi un colore di pannello neutro (crema/bianco sporco) per aree di contenuto, moduli e blocchi di testo lunghi. Questo riduce l’affaticamento visivo e aiuta a mantenere l’accessibilità su diversi dispositivi e condizioni di luce.

Crea visuali della tavolozza giallo scuro blu con l'intelligenza artificiale

Se vuoi vedere un’anteprima di come appare una palette giallo e blu scuro su poster, landing page, packaging o schermo UI, creare mockup rapidi è il modo più veloce per valutare contrasto e mood.

Con lo strumento di generazione immagini da testo di Media.io, puoi incollare un prompt, descrivere il layout e variare l’enfasi dei colori in pochi secondi—così puoi decidere se il tuo giallo deve essere limone brillante, senape o dorato.

Prossimo: Palette colori oro Champagne