QR Code Won't Scan? Complete Design Guidelines for Size, Quiet Zone, Color, and Placement
Utility

QR Code Won't Scan? Complete Design Guidelines for Size, Quiet Zone, Color, and Placement

Most unreadable QR codes fail due to insufficient size, no quiet zone, or low contrast. Learn the minimum recommended dimensions, quiet zone rules, color contrast requirements, and error correction levels.

Main Causes of Unreadable QR Codes

Trouble with QR codes not scanning correctly mostly occurs during design or printing stages. Main causes fall into four categories:

1. Insufficient Size

When QR codes are too small, smartphone cameras can't accurately recognize fine dots. Particularly, information-heavy QR codes (long URLs, complex data) have more dots with higher density, making minimum size constraints stricter.

2. Insufficient Quiet Zone (Margin)

Around QR codes, a margin called "quiet zone" is essential. Without this margin, scanning apps can't accurately recognize QR code boundaries, causing scan failures. Many cases occur where designers prioritize aesthetics and remove margins.

3. Insufficient Contrast

QR codes express information through contrast between dark colors (usually black) and light colors (usually white). Small color difference between background and foreground prevents scanning apps from accurately identifying dots.

Particularly, when prioritizing "stylish design" with combinations like gray and light gray or pastels, scan failure rates spike.

4. Print Quality and Material Issues

Even high-resolution generated QR codes become unreadable if they blur or bleed during printing. Also, printing on glossy materials or curved surfaces makes scanning difficult due to reflection or distortion.

QR code minimum size is determined by "scanning distance" and "information volume."

Basic Calculation Formula

QR code minimum size can be calculated with this formula:

Minimum Size (cm) = Scanning Distance (cm) ÷ 10

For example, scanning from 50cm distance, minimum size is 50 ÷ 10 = 5cm.

However, this is theoretical; in practice, more margin is recommended. Particularly when elderly or visually impaired users are expected, 1.5-2x size is desirable.

Business Cards

  • Minimum size: 1.5cm × 1.5cm
  • Recommended size: 2cm × 2cm or more
  • Scanning distance: About 15-20cm (handheld viewing distance)

Business cards are scanned at close range, so relatively small sizes work, but 2cm+ is safe depending on information volume (URL length, etc.).

Flyers and Brochures

  • Minimum size: 2cm × 2cm
  • Recommended size: 3-4cm × 3-4cm
  • Scanning distance: About 30-40cm (handheld viewing distance)

For handheld print materials, 3cm+ is readable and design-balanced.

Posters and Signs

  • Minimum size: 5cm × 5cm or more
  • Recommended size: 10-15cm × 10-15cm
  • Scanning distance: 50cm-2m (viewing from distance)

Posters and signs assume scanning from distance, requiring larger sizes. Outdoor signs recommend even larger (20cm+).

Digital Screens (Websites, Apps)

QR codes on digital screens require appropriate sizes depending on screen size and resolution.

  • Smartphone screen: Minimum 150px × 150px, recommended 200px+
  • PC screen: Minimum 200px × 200px, recommended 300px+

For digital, zoom is possible so slightly smaller works, but initial display should be scannable size.

Adjustment by Information Volume

More information in QR codes increases dots and density. Therefore, size must be adjusted according to information volume.

  • Short URL (under 20 characters): Above minimum size OK
  • Long URL (50+ characters): 1.5x minimum size or more
  • Complex data (vCard, Wi-Fi settings): 2x minimum size or more

For information-heavy codes, using URL shorteners (bit.ly, TinyURL, etc.) reduces dots, making smaller sizes readable.

Importance of Quiet Zone (Margin)

Quiet zone is the "unprinted margin" required around QR codes. This is essential for scanning apps to accurately recognize QR code boundaries.

Required Margin Size

QR code standards (ISO/IEC 18004) define quiet zone width as "4 times the minimum module (smallest square dot) of the QR code."

In practice, secure margins by these standards:

  • Minimum 10% margin on all sides relative to one side of QR code
  • Example: For 4cm × 4cm QR code, 4mm (0.4cm)+ margin on each side

However, 10% is bare minimum; in practice, 15-20% margin is recommended. Wider margins improve scanning accuracy.

Common Margin Mistakes

1. Text or Images Touching QR Code

When text like "Learn more →" or arrows are adjacent or touching QR codes, quiet zone is violated causing scan errors. Leave at least 5mm, preferably 1cm margin.

2. Design Elements Surrounding QR Code

Decorative borders or background patterns around QR codes prevent quiet zone securing, making scanning difficult.

3. QR Code Placed on Background Image

Placing QR codes on photos or patterns causes background patterns to intrude on quiet zone, reducing scan accuracy. Always place QR codes on solid-color backgrounds (white optimal).

Proper Quiet Zone Securing Method

When placing QR codes in design tools (Illustrator, Photoshop, Canva, etc.), secure margins following these steps:

  1. Place a white (or background color) square around QR code image
  2. That square's size should be 120-130% of QR code size
  3. Place other design elements outside this square

Example: For 4cm × 4cm QR code, center it in a 5cm × 5cm white square, placing other elements outside the square.

Color Usage

QR code scan accuracy heavily depends on contrast ratio between foreground color (dots) and background color.

Minimum Contrast Ratio

Following Web Content Accessibility Guidelines (WCAG), a minimum 4.5:1 contrast ratio is recommended. However, for QR code scanning, higher contrast ratios (7:1+) are desirable.

Foreground (Dots)BackgroundContrast RatioScan Accuracy
BlackWhite21:1★★★★★ Highest
Dark NavyWhite12:1★★★★☆ Good
Dark GreenWhite8:1★★★☆☆ Fair
Gray (#666)White5.7:1★★☆☆☆ Low
Gray (#999)White2.8:1★☆☆☆☆ Difficult
WhiteBlack21:1★★★★★ Highest (inverted)

Color Combinations to Avoid

Avoid these combinations as they significantly reduce scan accuracy:

  • Light gray × white
  • Pastel colors × white
  • Yellow × white (extremely low contrast)
  • Same-family tones (blue × light blue, green × yellow-green)
  • Red × green (also inappropriate from color vision diversity perspective)

Colored QR Code Precautions

For corporate branding, you may want to use logo colors in QR codes. In that case, note these points:

  1. Foreground color must be dark (30% brightness or less)
  2. Background color must be light (80% brightness or more)
  3. Verify contrast ratio with measurement tools (WebAIM Contrast Checker, etc.)
  4. Perform actual test scans on multiple devices

Inverted (White/Black Reversed) QR Codes

"Inverted QR codes" with white dots on black backgrounds are technically possible but have constraints:

  • May not scan depending on app compatibility
  • White dots tend to thin from print bleeding, reducing accuracy
  • Tend to scan slower than standard black dots

Unless specifically needed, standard "black dots × white background" is safest.

Material and Surface Treatment Precautions for Printing

Material and surface treatment for printing QR codes significantly affect scan accuracy.

Minimum resolution for printing QR codes is 300dpi (dots per inch). Lower resolution printing blurs dot outlines, making them unreadable.

Particularly, printing low-resolution web images (72dpi) directly almost certainly fails. For printing, always use high-resolution vector format (SVG, EPS) or raster format (PNG 300dpi+).

Good Materials

  • Matte paper (non-glossy): Minimal reflection, most readable
  • Premium paper: Standard printing paper, scans fine
  • Cardboard/thick paper: Readable if surface is smooth

Materials Requiring Caution

  • Glossy paper: May be hard to scan due to light reflection. Often scans at different angles
  • Laminate coating: Difficult to scan due to surface reflection. Matte laminate recommended
  • Clear stickers: Underlying colors/patterns showing through reduce contrast

Materials to Avoid

  • Fabric: Often unreadable due to surface irregularities and fiber shadows
  • Metal: Strong light reflection makes scanning difficult
  • Curved surfaces (cylinders, spheres): QR codes distort and don't scan. Print on flat surfaces when possible
  • Wet surfaces: Water droplets diffuse light, making scanning impossible

Surface Treatment Precautions

  • UV Coating: High gloss makes scanning difficult. Matte coating recommended
  • Embossing: Irregularities distort dots, inappropriate
  • Foil stamping: Gold/silver foil doesn't scan due to light reflection

Choosing Error Correction Level

QR codes have built-in "error correction" to remain scannable despite damage or dirt. Error correction levels are four stages: L, M, Q, H.

LevelCorrection CapacityRecommended Use
LAbout 7%Clean environments (digital screens, pristine print)
MAbout 15%Normal print materials (flyers, brochures)
QAbout 25%Outdoor/easily soiled environments (posters, packaging)
HAbout 30%Harsh environments (industrial products, long-term use locations), or logo embedding

How to Choose Error Correction Level

L Level (7%)

  • QR codes on digital screens (websites, apps)
  • Print materials used indoors in clean environments for short periods
  • When data volume is large and size needs to be small

M Level (15%)

  • Normal print materials (business cards, flyers, brochures)
  • Short to medium-term use (several months)
  • Most balanced standard level

Q Level (25%)

  • Outdoor posters and signs
  • Long-term use print materials (1 year+)
  • Locations expecting dirt or wear (product packaging, industrial products)

H Level (30%)

  • Design QR codes embedding logos or images in center
  • Extremely harsh environments (construction sites, permanent outdoor signs)
  • When maximum safety is required

Relationship Between Error Correction Level and Size

Higher error correction levels increase dots in QR codes. Therefore, for the same information volume, H level is larger (or dots are denser) than L level.

When printing at small sizes is necessary, choose L level and shorten URLs with shortening services to fit the readable minimum size.

Using QR Code Generation Tools

Using specialized tools is convenient for generating QR codes with appropriate size, error correction level, and colors.

QR Code GeneratorCreate customized, scan-ready QR codes for URLs, text, and contacts.

This tool allows these settings:

  • Supports various data formats: URL, text, contact info, Wi-Fi settings, etc.
  • Select error correction level (L/M/Q/H)
  • Specify size (in px)
  • Customize colors (foreground/background)
  • Download in SVG/PNG format (print-ready high resolution)

Always test generated QR codes with multiple smartphones and scanning apps before actual use. Particularly, printing small test prints and scanning them before final printing prevents production failures.

QR Code Scan Test Checklist

Before actually using QR codes, verify with this checklist:

Design Stage

  • Is size sufficient for use (above minimum recommended size)?
  • Is 10%+ margin (quiet zone) secured on all sides?
  • Is contrast ratio between foreground and background 7:1 or more?
  • Is background solid color (preferably white)?
  • Do other design elements avoid touching or overlapping QR code?

Printing Stage

  • Is resolution 300dpi or more?
  • Using print-ready high-resolution file (SVG or PNG)?
  • Is print material appropriate (matte/premium paper recommended)?
  • Is surface treatment (coating, etc.) appropriate?

Scan Test

  • Does it scan with iPhone (standard camera app)?
  • Does it scan with Android (Google Lens, standard camera)?
  • Does it scan in dim environments?
  • Does it scan from oblique angles?
  • Is scanning distance as expected?

Testing with multiple devices and apps helps discover scan accuracy issues beforehand.

Summary

Most unreadable QR code troubles stem from insufficient size, no margin, or low contrast. Following minimum recommended sizes for use, securing 10%+ margins (quiet zone) on all sides, and achieving 7:1+ contrast ratio between foreground and background significantly improves scan accuracy.

When printing, use high-resolution files of 300dpi+, and choose low-reflection materials like matte or premium paper. Glossy paper and laminate coating require caution as they hinder scanning.

Choose error correction level from L/M/Q/H according to use. M level for normal print, Q level for outdoor or long-term use, H level for design QR codes (logo embedding) are recommended.

Use QR code generation tools to create QR codes with appropriate settings, and always perform scan tests on multiple devices before actual use. Advance verification prevents scan failures in production.

Related Articles