Adding a logo to a QR code

A logo in the middle of a QR code is not a trick or a hack. It is a deliberate use of the redundancy built into the format — with a budget you can overspend.

Every QR code stores its content more than once. The format includes Reed–Solomon error correction, which means a reader can reconstruct the data even when part of the pattern is unreadable — smudged, torn, obscured by a coffee ring, or covered by your logo. The logo is not fighting the code; it is spending a budget the code already set aside.

How much you can actually cover

QR codes come with four error-correction levels, usually named L, M, Q and H, recovering roughly 7%, 15%, 25% and 30% of the data respectively. It is tempting to read the highest as "I can cover 30% of the code". You cannot.

That budget is not reserved for your logo. It also has to absorb:

• Print registration and ink spread, which blur module edges.
• Glare, folds, scuffs and fingerprints on the finished piece.
• A phone camera that focuses imperfectly, at an angle, in poor light.
• Whatever the paper does after a month on a counter.

Spend the whole allowance on the logo and there is nothing left for the real world. A useful working limit is well under half of it — a logo occupying somewhere around a tenth of the code's area, at the highest correction level, leaves comfortable headroom. Bigger than that and the code starts to depend on ideal conditions.

Where the logo must not go

Error correction protects the data modules. It does not protect the structural parts a scanner needs to locate and orient the code in the first place:

• The three finder patterns — the large squares in the top-left, top-right and bottom-left corners. A scanner finds the code by finding these. Cover one and there is nothing to correct, because the code is never recognised as a code.
• The timing patterns — the alternating lines running between the finders, which tell the reader the module grid size.
• The quiet zone — the empty margin around the whole code.

This is why centre placement is the convention. The middle of the code is data, and data is exactly what error correction knows how to rebuild.

Making the logo itself work

• Give it a solid background — usually a small light panel behind it, matching the code's background. A logo laid directly over modules with a transparent background confuses the reader for no benefit.
• Keep it square or round and centred. Wide horizontal logos eat a whole band of the code; a monogram or mark works far better than a full wordmark.
• Simplify. At 2 cm printed, a detailed logo is a smudge anyway — the recognisable silhouette is doing all the work.
• Keep the code's contrast intact around it. A dark logo on a dark code both fails to read and fails to look like anything.

Colour, while you are here

Brand colour on the modules themselves is fine, and often better than a logo for making a code feel yours. The rule is only that dark modules must stay clearly darker than the background. Deep brand colours on white read as well as black. Pale colours, mid-tones on mid-tones and inverted codes are where scanning gets unreliable.

Gradients are safe as long as both ends of the gradient are dark against the background. A gradient running from dark to pale looks striking and fails on the pale end.

The test that actually matters

1. Export at the size and resolution you will print.
2. Print it on the real material.
3. Scan it with two or three phones, including the oldest one you can find, at the distance a real person would use.
4. Do it again in poor light, and at an angle.
5. If any of those hesitate, shrink the logo and repeat. Hesitation on a proof means failure in the field.

Sharen gives the logo a size control precisely so this is a dial rather than a rebuild: shrink it a step, re-export, test again. And because the code encodes your address directly, what you tested is what ships — see why QR codes stop working for the failure modes that have nothing to do with design.

Questions people ask before printing