Come Creare un Codice QR con il Tuo Logo (Guida Passo dopo Passo + 12 Consigli di Design)

Risposta Rapida

Per creare un codice QR con il tuo logo, usa un generatore di codici QR che supporta l'inserimento del logo con correzione degli errori di livello H, inserisci un logo quadrato o PNG con trasparenza al centro con una copertura non superiore al 30% della matrice, e testa il risultato su almeno tre telefoni reali prima di stampare. L'intero processo richiede 90 secondi in QRbug, Adobe Express, o in qualsiasi creatore di codici QR moderno.

La trappola in cui cadono la maggior parte dei team: inserire un logo troppo grande o troppo dettagliato su un codice con correzione degli errori predefinita, il che interrompe silenziosamente l'affidabilità della scansione per circa il 20% degli utenti. Questa guida copre le 12 regole di design che usiamo per mantenere i codici QR branded scansionabili, più la configurazione passo dopo passo nei generatori principali.

Perché incorporare un logo?

Due motivi supportati da dati di settore:

1. Aumento del tasso di scansione. Uno studio Scanova del 2025 su 18.000 codici ha rilevato che i codici QR brandizzati (con logo) avevano un tasso di scansione del 26% più alto rispetto ai codici in bianco e nero semplici con lo stesso posizionamento. Gli utenti riconoscono il marchio, si fidano di esso e scansionano con intento.

2. Ricordo del marchio. Un codice QR con il tuo logo è un'impressione del marchio anche prima della scansione. Gli utenti vedono centinaia di codici QR all'anno; quelli con un logo si registrano come tuoi.

Costo: una leggera riduzione dell'affidabilità della scansione (compensata dalla correzione degli errori) più 30 secondi di lavoro di progettazione.

Come funzionano tecnicamente i loghi incorporati

Un codice QR riserva una porzione dei suoi moduli per la correzione degli errori — la codifica Reed–Solomon consente allo scanner di ricostruire i dati mancanti o danneggiati fino a una percentuale definita della matrice:

Quando incorpori un logo, copri (e distruggi efficacemente) i moduli sottostanti. La correzione degli errori deve essere sufficientemente alta per ricostruire l'area coperta. Il livello H tollera fino al 30% di copertura; sotto il 30%, gli scanner possono recuperare. Sopra il 30%, l'affidabilità della scansione crolla.

La matematica non è lineare. Con copertura del logo del 25% sul livello H, l'affidabilità della scansione rimane superiore al 95%. Al 35%, scende sotto l'80%. Al 40%, sotto il 60%. Non superare mai il 30% non importa quanto bene il logo appaia al 35%.

Le 12 regole per un codice QR con logo incorporato che funziona

Queste sono le regole che applichiamo a ogni embed di logo del cliente. Segui tutte e 12 e non avrai problemi di scansione.

1. Imposta la correzione degli errori su H prima di aggiungere il logo

La maggior parte dei generatori usa predefinito M. M può tollerare solo il 15% di copertura; hai bisogno di H per raggiungere il 30%. Cambia prima, poi aggiungi il logo.

2. Limita la copertura del logo al 30% della matrice

Usa il righello visivo nel tuo generatore. Il logo dovrebbe stare dentro il centrale 1/3 del codice QR, non andare oltre.

3. Posiziona il logo esattamente al centro

I logo fuori centro aumentano le probabilità di sovrapposizione con un quadrato di ricerca (i tre grandi angoli), che lo scanner non può correggere con errori. Centra sempre.

4. Usa un logo quadrato o circolare, non un rettangolo largo

Un logo largo consuma moduli orizzontali in modo sproporzionato. I logo quadrati o circolari sono più efficienti con il budget di copertura.

5. Aggiungi un anello di padding bianco (o del colore di sfondo) intorno al logo

La maggior parte dei generatori lo fa automaticamente. Il padding dà allo scanner un confine pulito tra logo e matrice, migliorando il riconoscimento.

6. Non usare uno sfondo trasparente — scegli un colore solido

I logo trasparenti lasciano che la matrice QR trapeli, creando un centro affollato e difficile da scansionare. Usa un colore solido (bianco, colore del brand, o sfondo corrispondente).

7. Scegli logo ad alto contrasto

Un logo grigio pallido su uno sfondo blu chiaro sembra bello ma non offre contrasto per lo scanner se lo sfondo trapela. I logo ad alto contrasto si leggono come una forma pulita.

8. Testa alle dimensioni di stampa effettive, non a 600×600

Un logo che sembra bello a 600×600 px sullo schermo potrebbe dominare la matrice a 25mm di dimensione di stampa effettiva. Renderizza il codice QR alla dimensione finale prevista prima di approvare.

9. Testa su tre telefoni reali — vecchi + nuovi, iOS + Android

Lo scanner su un iPhone 15 è molto più tollerante che su un iPhone 8 o un Android di 4 anni fa. Se uno qualsiasi dei tre dispositivi di test non riesce, riduci la dimensione del logo del 5%.

10. Mantieni il logo monocromatico o a due colori

Un logo multicolore con gradienti introduce rumore che lo scanner deve filtrare. Gli embed di logo più puliti sono forme piatte, 1–2 colori.

11. Evita logo con linee sottili o dettagli fini

I dettagli sotto i 4 pixel alle dimensioni stampate scompaiono comunque. Usa la versione semplificata del tuo logo (la versione "favicon") per l'incorporamento in codice QR.

12. Ritesta dopo ogni ciclo di stampa

La qualità di stampa varia tra le tipografie. Un logo che ha scansionato con affidabilità del 99% sulla prova digitale potrebbe scendere all'85% su carta stampa economica. Testa sempre la stampa fisica effettiva.

Step-by-step in QRbug

90 secondi, da inizio a fine:

1. Vai su qrbug.com.
2. Seleziona il tipo URL. Incolla la tua destinazione.
3. Clicca su Customize → Error correction → impostalo su H.
4. Clicca su Logo → carica il tuo PNG o SVG. Consigliato: quadrato, 200×200 px o SVG 1:1, sfondo trasparente o bianco.
5. Regola il logo size slider a circa il 25% (rimani sotto il 30%).
6. Scegli i colori del brand per dot color e eye color. Verifica un contrasto di almeno 4.5:1 rispetto allo sfondo.
7. Clicca su Download SVG. (Usa SVG per la stampa, PNG per lo schermo.)
8. Testa il file eseguendo la scansione da tre telefoni diversi.

Se uno dei telefoni fallisce, aumentare la correzione degli errori (già impostata su H) è impossibile — invece riduci la dimensione del logo al 22%, aumenta il contrasto o semplifica il logo.

Passo dopo passo in Adobe Express

Un po' più controllo del design, flusso di lavoro simile:

1. Nuovo progetto codice QR. Scegli il tipo URL, incolla la destinazione.
2. Apri il pannello Design. Imposta il livello di correzione degli errori su H.
3. Fai clic su + Aggiungi elemento → carica il tuo logo. Trascinalo al centro. Ridimensionalo a circa il 25% del codice QR.
4. Usa lo strumento di selezione colore di Adobe per impostare il colore di primo piano. Lo sfondo di default è bianco.
5. Esporta come SVG (1200×1200) per la stampa.

Adobe Express ha controlli di posizionamento del logo leggermente più stretti ma manca il reindirizzamento dinamico (è un generatore solo statico). Va bene per codici con marchio una tantum; non per campagne che hanno bisogno di analisi delle scansioni.

Generazione passo per passo usando la libreria qr-code-styling (sviluppatori)

Per la generazione programmatica:

import QRCodeStyling from 'qr-code-styling'

const qr = new QRCodeStyling({
  width: 600,
  height: 600,
  type: 'svg',
  data: 'https://example.com',
  image: '/path/to/logo.png',
  qrOptions: {
    errorCorrectionLevel: 'H',
  },
  imageOptions: {
    hideBackgroundDots: true,
    imageSize: 0.3,           // 30% coverage cap
    margin: 4,                // padding ring
    crossOrigin: 'anonymous',
  },
  dotsOptions: {
    color: '#1d4ed8',
    type: 'rounded',
  },
  cornersSquareOptions: {
    color: '#1d4ed8',
    type: 'extra-rounded',
  },
  backgroundOptions: {
    color: '#ffffff',
  },
})

await qr.toFile('output.svg')

Il imageSize: 0.3 è il limite sulla copertura del logo — non aumentarlo mai al di sopra di 0.3. L'opzione hideBackgroundDots: true rimuove i puntini sotto il logo, offrendo al scanner bordi più puliti.

Errori comuni

Logo troppo grande

La modalità di errore più comune. Un logo al 35% sembra perfetto sullo schermo ma compromette l'affidabilità della scansione su telefoni più vecchi. Rimani al 30% o sotto.

Livello di correzione degli errori sbagliato

Il livello M predefinito offre il 15% di recupero. Un logo al 30% sul livello M è illeggibile per metà della popolazione. Passa sempre al livello H per primo.

Logo multicolore con gradienti

L'algoritmo di soglia dello scanner deve decidere quali pixel sono "modulo" e quali sono "logo". I gradienti lo confondono. Solo colori piatti.

Logo sopra i quadrati di ricerca

I tre grandi quadrati agli angoli è così lo scanner si orienta. Se il logo si sovrappone a uno di loro, lo scanner non può bloccarsi, correzione degli errori o meno. Centra il logo lontano dagli angoli.

Saltare il test di stampa

I logo che scansionano al 100% digitalmente falliscono al 60% su carta stampata o tela. Il mezzo di stampa assorbe l'inchiostro e ammorbidisce i bordi; entrambi riducono il contrasto. Testa sullo stock effettivo.

Incorporare un logo in un codice QR statico per una campagna lunga

Se dovrai aggiornare l'URL in seguito, dovrai ristampare l'intero codice branded. Usa il dinamico per qualsiasi codice QR di campagna — vedi codici QR dinamici spiegati.

Guida alle dimensioni del logo per caso d'uso di codici QR

Queste sono raccomandazioni conservative. Puoi spingere più in alto in condizioni controllate, ma un margine di sicurezza del 5% si ripaga la prima volta che qualcuno scansiona da un angolo sfavorevole.

Quando NON incorporare un logo

Tre casi in cui un codice QR semplice è migliore:

1. Ambienti critici per la scansione. Confezioni farmaceutiche, dispositivi medici, codici QR per pagamenti — ovunque un'interruzione della scansione abbia un costo reale. Salta il logo, dai priorità all'affidabilità.

2. Dimensioni di stampa molto piccole. Sotto i 15mm × 15mm, anche un logo minuscolo consuma troppo della matrice. Solo codice semplice.

3. Payload di dati ad alta densità. Un codice QR che codifica 500+ caratteri è già al limite della scannabilità. Aggiungere un logo in cima riduce ulteriormente il margine.

Per tutto il resto — campagne di marketing, menù del ristorante, segnaletica per eventi — un logo ben dimensionato è un incremento gratuito del tasso di scansione del 26%.

Domande Frequenti

Qual è la dimensione massima del logo per un codice QR?

Il 30% dell'area della matrice al livello di correzione degli errori H. Al di sopra del 30%, l'affidabilità della scansione diminuisce drasticamente. Al di sotto del 25% è la zona sicura per i telefoni più vecchi.

Perché il mio codice QR con logo non esegue la scansione?

I motivi più comuni in ordine: la correzione degli errori è stata impostata su M invece di H; il logo supera la copertura del 30%; il logo è troppo fuori centro e si sovrappone a un quadrato di ricerca; contrasto insufficiente tra i punti e lo sfondo; oppure la dimensione stampata è inferiore a 2 cm × 2 cm.

Posso inserire qualsiasi logo in un codice QR?

Sì, purché rispetti le regole di dimensioni e copertura. I logo quadrati, monocromatici e semplici funzionano meglio. I rettangoli larghi, i gradienti multicolore e i logo ricchi di dettagli funzionano peggio.

Aggiungere un logo rende il codice più facile da individuare?

Sì — gli studi pubblicati (Scanova 2025) mostrano tassi di scansione superiori del 26% per i codici branded rispetto a quelli semplici. Gli utenti riconoscono e si fidano del brand, e scansionano con intento.

Ho bisogno di un generatore di codici QR speciale per i logo?

La maggior parte dei generatori moderni supporta i logo immediatamente. Le funzionalità da verificare: livello di correzione degli errori selezionabile (deve includere H), slider per la dimensione del logo, rimozione automatica dello sfondo dei punti ed esportazione SVG. Abbiamo coperto il framework di valutazione completo nella guida completa del generatore di codici QR.

Posso usare la mia favicon come logo del codice QR?

Sì, ed è spesso la scelta migliore. Le favicon sono versioni semplificate del logo del brand, progettate per essere leggibili a dimensioni piccole — lo stesso vincolo che ha un logo incorporato in un codice QR. Riesporta la favicon a 200×200 px PNG con sfondo trasparente e inseriscila.

Qual è la differenza tra un «codice QR con logo» e un «codice QR branded»?

Funzionalmente uguali — entrambi si riferiscono a un codice QR con logo incorporato e (solitamente) punti colorati del brand. «Codice QR branded» a volte implica anche una cornice personalizzata attorno al codice, che aggiunge un altro livello visivo ma non cambia la matrice.

Un logo trasforma un codice QR generico in un'impressione del brand — al costo di una regola: restare sotto la copertura del 30% al livello H. Segui quella e il resto delle regole diventano tattiche.

Se vuoi saltare la configurazione manuale, il generatore di codici QR branded di QRbug applica automaticamente il livello H + limite del 30% + posizionamento al centro quando carichi un logo.