# Combinazioni di colori per loghi che funzionano, con codici hex

[Canonical HTML page](https://gradiently.design/it/guide/color-combinations-for-logos)

Un logo deve sopravvivere a una favicon, a una fotocopia in grigio e a un header in modalità scura. Queste coppie e triadi sono scelte per riuscirci, con codici e contrasti che puoi verificare da solo.

## The short version

- La maggior parte dei loghi forti usa uno o due colori, perché ogni colore in più rende il marchio più difficile da riprodurre in piccolo, in stampa e su sfondi diversi.
- Un buon logo a due colori abbina un colore scuro a uno chiaro o vivace, così le forme restano distinte anche quando i colori sono difficili da distinguere.
- Due colori di chiarezza simile, come un rosso medio e un blu medio, sembrano vibrare dove si toccano e perdono definizione se stampati in grigio.
- Ogni logo dovrebbe funzionare anche in un solo colore, in nero e in bianco, prima di aggiungere qualsiasi colore.
- I colori di un logo non devono essere l’intera palette del brand: il marchio può restare semplice mentre gli sfondi intorno portano il colore più ricco.

Le **combinazioni di colori per loghi** che funzionano meglio abbinano un colore scuro a uno chiaro o vivace, come blu notte e oro, verde bosco e crema, o antracite e lime. La differenza di chiarezza mantiene leggibili le forme alla dimensione di una favicon e in scala di grigi, mentre la differenza di tinta dà personalità al marchio. Qui sotto trovi dieci coppie testate e tre triadi con codici hex e rapporti di contrasto, poi un modo rapido per verificare da solo qualsiasi combinazione.

## Perché i loghi usano pochi colori

Un logo è la cosa più riprodotta che un’attività possiede. Appare come icona del browser da 16 pixel, ricamato su una maglietta, stampato su un bicchiere di caffè e in un solo colore su uno scontrino. Ogni colore che aggiungi è un’altra cosa che può andare storta in uno di quei posti. Per questo tanti marchi noti hanno un colore solo, e quasi tutti gli altri due.

Parti dal nero. Se la forma funziona in nero su bianco e in bianco su nero, il colore può solo aiutare. Se non funziona, nessuna combinazione la salverà. [Le basi del design di un logo](https://gradiently.design/it/guide/logo-design-basics) trattano il lato della forma; questo articolo presume che la forma sia già decisa.

## Dieci combinazioni di colori per un logo a due colori

- Blu notte e oro: `linear-gradient(90deg, #14213d 0%, #14213d 55%, #fca311 55%, #fca311 100%)`
- Verde bosco e crema: `linear-gradient(90deg, #1b4332 0%, #1b4332 55%, #f1e9da 55%, #f1e9da 100%)`
- Antracite e lime: `linear-gradient(90deg, #2d2d2d 0%, #2d2d2d 55%, #c6f432 55%, #c6f432 100%)`
- Prugna e rosa tenue: `linear-gradient(90deg, #4a1942 0%, #4a1942 55%, #f7c8d0 55%, #f7c8d0 100%)`
- Bordeaux e sabbia: `linear-gradient(90deg, #6b0f1a 0%, #6b0f1a 55%, #e9d8a6 55%, #e9d8a6 100%)`
- Inchiostro e arancio: `linear-gradient(90deg, #1c1917 0%, #1c1917 55%, #f97316 55%, #f97316 100%)`
- Viola e menta: `linear-gradient(90deg, #5b21b6 0%, #5b21b6 55%, #a7f3d0 55%, #a7f3d0 100%)`
- Cobalto e bianco: `linear-gradient(90deg, #1d4ed8 0%, #1d4ed8 55%, #ffffff 55%, #ffffff 100%)`
- Nero e rosso segnale: `linear-gradient(90deg, #111111 0%, #111111 55%, #e63946 55%, #e63946 100%)`
- Verde acqua e corallo: `linear-gradient(90deg, #0f766e 0%, #0f766e 55%, #ff7f6e 55%, #ff7f6e 100%)`

Dieci coppie mostrate come stacchi netti, nel modo in cui si incontrano dentro un marchio. Clicca su un campione per copiarne il codice.

| Coppia | Codici | Contrasto | Trasmette |
| --- | --- | --- | --- |
| Blu notte e oro | `#14213d` `#fca311` | 7,9:1 | Solidità, sicurezza, un tocco di classico |
| Verde bosco e crema | `#1b4332` `#f1e9da` | 9,2:1 | Naturale, artigianale, calmo |
| Antracite e lime | `#2d2d2d` `#c6f432` | 10,7:1 | Energico, sportivo, tecnico |
| Prugna e rosa tenue | `#4a1942` `#f7c8d0` | 9,4:1 | Caldo, bellezza, boutique |
| Bordeaux e sabbia | `#6b0f1a` `#e9d8a6` | 8,7:1 | Tradizione, vino, ospitalità |
| Inchiostro e arancio | `#1c1917` `#f97316` | 6,2:1 | Pratico, cordiale, mestieri e attrezzi |
| Viola e menta | `#5b21b6` `#a7f3d0` | 7,0:1 | Moderno, giocoso, software |
| Cobalto e bianco | `#1d4ed8` `#ffffff` | 6,7:1 | Chiaro, affidabile, digitale |
| Nero e rosso segnale | `#111111` `#e63946` | 4,5:1 | Deciso, urgente, editoriale |
| Verde acqua e corallo | `#0f766e` `#ff7f6e` | 2,2:1 | Vivace, ma solo come forme a contatto, mai testo su testo |

Rapporti di contrasto WCAG tra le coppie. Sopra 4,5:1 un colore può stare sull’altro come scritta; le coppie più basse vanno affiancate come forme.

Nota che verde acqua e corallo è la voce fuori dal coro. Entrambi i colori hanno una chiarezza simile, quindi lettere corallo su un badge verde acqua sarebbero difficili da leggere e diventerebbero un’unica macchia grigia in una stampa in bianco e nero. La coppia funziona comunque quando i colori sono forme separate, come un simbolo verde acqua accanto a un logotipo corallo, ciascuno su fondo bianco o scuro. I numeri vengono dalla formula WCAG spiegata in [contrasto dei colori e accessibilità](https://gradiently.design/it/guide/color-contrast-accessibility).

## Combinazioni di colori per un logo a tre colori

Tre colori vanno bene per marchi fatti di pezzi separati: un simbolo composto da tessere, un logotipo con un punto colorato, un insieme di forme per un brand per bambini. Ancora il trio con un colore scuro, poi scegline due chiaramente diversi per tinta. Distanziarli lungo la ruota, come nei [colori triadici](https://gradiently.design/it/guide/triadic-colors), evita che facciano a gara.

- Mare profondo: #003049
- Papavero: #d62828
- Senape: #fcbf49

Primari, ma da adulti. Un blu scuro ancora un rosso e un giallo che altrimenti griderebbero. Adatto a scuole, sport e giocattoli pensati per i genitori.

- Verde ardesia: #264653
- Zafferano: #e9c46a
- Corallo bruciato: #e76f51

Calore di costa. Il verde ardesia regge il logotipo; zafferano e corallo bruciato riempiono le forme del simbolo.

- Notte: #10002b
- Magenta: #f72585
- Ciano: #4cc9f0

Digitale e forte. Magenta e ciano brillano contro un’àncora quasi nera, per marchi di musica, videogiochi e vita notturna.

## Combinazioni di colori da evitare nei loghi

### Evita

- Rosso medio e blu medio a contatto: sembrano vibrare
- Rosso puro e verde puro insieme: difficili per molte persone daltoniche
- Giallo o pastelli tenui su bianco: il marchio sparisce
- Quattro o più colori dello stesso peso
- Un gradiente come unica versione del logo

### Invece

- Rendi uno dei due molto più scuro
- Separali per chiarezza, non solo per tinta
- Metti i colori tenui su fondo scuro, o contornali
- Un colore guida, uno o due di supporto
- Prima una versione piatta, il gradiente come variante

I loghi con gradiente sono un caso speciale. Possono essere splendidi in grande, ma creano bande in stampa e si sfocano in piccolo. Tieni una versione piatta a uno o due colori e tratta il gradiente come una variante; [i loghi con gradiente](https://gradiently.design/it/guide/gradient-logo) spiegano come costruire entrambe.

## Come testare una combinazione di colori per un logo

1. **Stampalo in scala di grigi** Converti il logo in grigio. Se i due colori diventano lo stesso grigio, la coppia ha troppo poca differenza di chiarezza.
2. **Riducilo a 16 pixel** Guardalo come icona di una scheda del browser. Le parti sottili in un colore tenue spariscono per prime.
3. **Invertilo** Metti il logo sul tuo colore di brand più scuro e sul bianco. Annota quale colore va scambiato in ciascun caso.
4. **Controlla il daltonismo** Passalo in un simulatore di daltonismo. Le coppie rosso e verde spesso si fondono per chi ha i tipi più comuni di daltonismo.
5. **Mettilo su uno sfondo vero** Un logo raramente sta su un bianco pulito nella realtà. Provalo su una foto, su un gradiente e in un feed affollato.

Design quadrato con la parola Harbour sopra un gradiente, con parti delle lettere che si confondono con lo sfondo

Un logotipo messo dritto su uno sfondo vivace può perdere parti delle lettere.

Lo stesso design quadrato in cui lo sfondo è più calmo dietro la parola Harbour, così ogni lettera si legge

Lo stesso logotipo con lo sfondo che si calma e si scurisce dietro.

Quest’ultimo test è dove molti loghi faticano. [Mettere un logo su uno sfondo a gradiente](https://gradiently.design/it/guide/logo-on-gradient-background) tratta le tecniche. In Gradiently un Mark sa dove stanno le parole e il logo: la sua regione più calma si sposta dietro di loro e l’inchiostro automatico sceglie chiaro o scuro riga per riga dalla palette del Mark stesso, così un semplice logo a due colori può stare su uno sfondo ricco senza un riquadro dietro.

## Tieni semplice il logo e lascia ricco il brand

Il logo non deve portare ogni colore che usa il tuo brand. Molti brand tengono il marchio in uno o due colori e mettono la profondità negli sfondi, nella fotografia e nei caratteri. Se stai scegliendo la palette più ampia, [le idee di colori per il brand](https://gradiently.design/it/guide/brand-color-ideas) ne offrono 30 da cui partire, e [i loghi famosi con gradiente](https://gradiently.design/it/guide/famous-gradient-logos) mostrano come i brand affermati bilanciano un marchio semplice con un colore espressivo.

## FAQ

### Qual è la migliore combinazione di colori per un logo?

Non esiste una sola coppia migliore, ma un colore scuro con uno chiaro o vivace, come blu notte e oro o verde bosco e crema, funziona quasi ovunque perché le forme restano distinte.

### Quanti colori deve avere un logo?

Uno o due per la maggior parte dei loghi. Tre possono funzionare per marchi fatti di pezzi separati, ma ogni colore in più rende più difficili la stampa e le dimensioni piccole.

### Quali colori non vanno usati insieme in un logo?

Evita colori della stessa chiarezza a contatto, come rosso medio e blu medio, ed evita di puntare sul rosso contro il verde, che molte persone daltoniche non distinguono.

### Un logo deve funzionare in bianco e nero?

Sì. Un logo dovrebbe funzionare in un solo colore, in nero e in bianco, prima di aggiungere il colore, perché verrà stampato e timbrato in tinta unica.

### Un logo può essere un gradiente?

Può, ma tieni una versione piatta per le dimensioni piccole, il ricamo e la stampa a un colore, e usa il gradiente dove ha spazio.
