How to Design a QR Code That Actually Gets Scanned

Most QR codes are invisible. Not literally — they're right there on the page — but they fail to attract attention or signal their purpose. Designing a QR code that performs means thinking about it as a piece of graphic design as much as a functional element.

The Non-Negotiable Technical Rules

• Minimum size: at least 2 × 2 cm for handheld materials, larger for distant viewing
• Contrast ratio: foreground modules must be significantly darker than background
• Quiet zone: at least 4 module widths of clear space around all four sides
• Error correction: use 'H' level (30%) if you want to add a logo — the built-in redundancy compensates for the obscured area
• Format: SVG for print, PNG for digital (minimum 300 DPI for print)

Using Colour Effectively

QR codes don't have to be black and white. You can use your brand's dark colour as the module colour against a light background. Dark navy on white, dark green on cream, and dark burgundy on a light warm grey all work well. What does not work: light modules on a dark background (technically possible but less reliable), and low-contrast colour combinations like yellow on white.

Adding a Logo to Your QR Code

A logo in the centre of a QR code makes it immediately recognisable and increases scan rates. Keep the logo small — it should cover no more than 20–25% of the total code area. Use a white or colour-matched background behind the logo to avoid interfering with surrounding modules. Always test scannability after adding the logo.

The Role of the Call to Action

Design the QR code unit as a whole: the code itself, the CTA text above or below it, and any supporting icons or imagery. The CTA text should use an action verb: 'Scan to book', 'Scan to download', 'Scan to claim offer'. Include a simple phone icon or 'scan me' graphic to signal the intended action to anyone unfamiliar with QR codes.

Common Design Mistakes to Avoid

• Placing the QR code over a busy photograph or patterned background
• Inverting colours (light modules on a dark background) without testing
• Cropping into the quiet zone with other design elements
• Making the logo too large — above 25% it affects scannability
• Using very thin, low-weight fonts in the CTA that are hard to read in print
• Not including a CTA at all