How QR Codes Work and How to Generate Custom Ones

ToolsPilot TeamJanuary 25, 20265 min read

How QR Codes Work and How to Generate Custom Ones

QR codes are everywhere — restaurant menus, payment apps, product packaging, event tickets, and business cards. These small squares of black and white modules encode data that any smartphone camera can read instantly.

But how do they actually work? And how can you create your own? Let's find out.

What Is a QR Code?

QR stands for "Quick Response." QR codes were invented in 1994 by Denso Wave (a Toyota subsidiary) to track automotive parts during manufacturing. Unlike traditional barcodes that store data in one dimension (a line), QR codes use a two-dimensional grid that can store significantly more information.

QR Code vs Barcode

Feature Barcode QR Code
Dimensions 1D (horizontal lines) 2D (grid of modules)
Data capacity ~20 characters Up to 4,296 characters
Data types Numbers only Text, URLs, binary data
Error correction None Up to 30% recovery
Read direction One direction Any angle

Anatomy of a QR Code

Every QR code contains several critical structural elements:

Finder Patterns

The three large squares in the corners (top-left, top-right, bottom-left) help scanners quickly locate and orient the QR code. These are always the same regardless of the encoded data.

Alignment Pattern

The smaller square near the bottom-right helps scanners correct for perspective distortion when the QR code isn't viewed head-on.

Timing Patterns

The alternating black and white modules between the finder patterns help the scanner determine the grid size and module dimensions.

Format Information

Encoded near the finder patterns, this tells the scanner which error correction level and mask pattern are used.

Data and Error Correction

The remaining modules contain the actual encoded data plus error correction codes.

Encoding Modes

QR codes support four encoding modes, each optimized for different types of data:

Mode Characters Bits per Character Best For
Numeric 0-9 3.33 Phone numbers, IDs
Alphanumeric 0-9, A-Z, space, $%*+-./: 5.5 Short text, URLs
Byte Full ASCII/UTF-8 8 URLs, JSON, any text
Kanji Japanese characters 13 Japanese text

The encoder automatically chooses the most efficient mode based on your input data.

Error Correction

One of QR codes' most impressive features is built-in error correction using Reed-Solomon codes. Even if part of the QR code is damaged, obscured, or dirty, the scanner can still read it.

Level Recovery Use Case
L (Low) ~7% Clean environments, small QR codes
M (Medium) ~15% General purpose (most common)
Q (Quartile) ~25% Industrial environments
H (High) ~30% Logos in center, outdoor use

Fun fact: Level H error correction is what allows companies to place logos in the center of their QR codes — the logo covers some modules, but the error correction recovers the lost data.

Types of QR Code Content

QR codes can encode various types of structured data:

URL

The most common type — encode any web address:

https://toolspilot.com/tools/qr-code-generator

Wi-Fi Network

Encode Wi-Fi credentials so guests can connect by scanning:

WIFI:T:WPA;S:NetworkName;P:Password123;;

Contact Card (vCard)

Share contact information:

BEGIN:VCARD
VERSION:3.0
N:Doe;Jane
TEL:+1234567890
EMAIL:jane@example.com
END:VCARD

Email

Pre-compose an email:

mailto:hello@example.com?subject=Hello&body=Hi there

Phone Number

Initiate a phone call:

tel:+1234567890

SMS

Pre-compose a text message:

sms:+1234567890?body=Hello

Geographic Location

Open a map location:

geo:37.7749,-122.4194

QR Code Best Practices

Size Matters

The minimum recommended size depends on scanning distance:

  • Business card: at least 2 × 2 cm (0.8 × 0.8 inches)
  • Flyer or poster: at least 3 × 3 cm (1.2 × 1.2 inches)
  • Billboard: scale proportionally to viewing distance

Rule of thumb: The QR code should be at least 1/10th of the scanning distance. For a sign viewed from 10 feet away, the QR code should be at least 1 foot across.

Contrast Is Critical

  • Use dark modules on a light background
  • Maintain high contrast (black on white is ideal)
  • Avoid placing QR codes on busy or colorful backgrounds
  • Never invert colors (light on dark) unless you test extensively

Keep URLs Short

Shorter data = fewer modules = easier to scan. Use URL shorteners for long links, or better yet, use short URLs from the start.

Test Before Printing

Always scan your QR code with multiple devices before printing thousands of copies. Test with:

  • iPhone Camera app
  • Android Camera app
  • At least one third-party scanner
  • Different lighting conditions
  • The intended scanning distance

Add a Call to Action

A QR code alone doesn't tell people what to do. Always include text like:

  • "Scan for menu"
  • "Scan to connect to Wi-Fi"
  • "Scan for more information"
  • "Scan to download the app"

Static vs Dynamic QR Codes

Static QR Codes

The data is encoded directly in the QR code. Once generated, it cannot be changed.

Pros: Works offline, no dependency on external services Cons: Can't update the destination, can't track scans

Dynamic QR Codes

The QR code points to a redirect URL that you control. You can change the destination without regenerating the QR code.

Pros: Editable destination, scan analytics, A/B testing Cons: Requires a redirect service, won't work if the service is down

Generating QR Codes

You can create QR codes instantly with our free QR Code Generator. Features include:

  • Multiple content types — URLs, text, Wi-Fi, vCard, email, phone, SMS
  • Customization — size, error correction level, colors
  • Download formats — PNG, SVG for print
  • No watermark — completely free
  • Client-side generation — your data never leaves your browser

Programmatic Generation

For developers who need to generate QR codes in code:

// Using the qrcode library (Node.js)
const QRCode = require("qrcode");

// Generate as data URL
const dataUrl = await QRCode.toDataURL("https://example.com");

// Generate as SVG string
const svg = await QRCode.toString("https://example.com", { type: "svg" });

The Future of QR Codes

QR codes have experienced a massive resurgence since the COVID-19 pandemic normalized contactless interactions. Their usage continues to grow in:

  • Mobile payments — QR-based payment systems are dominant in many countries
  • Authentication — WhatsApp Web, Discord, and many services use QR login
  • AR experiences — QR codes as triggers for augmented reality content
  • Supply chain — tracking products from manufacturing to delivery
  • Digital identity — vaccine passes, digital IDs, boarding passes

Wrapping Up

QR codes are a deceptively simple technology that solves a real problem — bridging the physical and digital worlds. Understanding how they work helps you use them more effectively and avoid common pitfalls.

Generate your own QR codes for free with our QR Code Generator — no signup required, no watermarks, and everything happens in your browser.

Share this article