Preview
350 × 350 pxSettings
Colors
Center Image
Content
Anatomy of a QR Code
A QR code isn't just a random pattern of squares. Every area has a dedicated job: some modules tell a scanner where the code is and how it's oriented, others carry the data, and others exist to protect the code against dirt, scratches and bad lighting.
Interactive Overview
Hover a region below to highlight it on the live QR code. Rendered at version 7 with error correction M — long enough to include version-info bits alongside the other functional regions.
Finder Patterns
Every QR code has three finder patterns, one in each corner except the bottom right. A scanner uses them to locate the code and work out its rotation: if it sees only three of them it knows exactly which way is “up”.
Their magic is the 1 : 1 : 3 : 1 : 1 ratio: no matter from which angle you slice through the center, you hit a dark/light/dark/light/dark sequence with those widths. That sequence is statistically extremely unlikely in real-world images, so finding it = finding a QR code.
Separators
Each finder pattern is wrapped in a one-module-wide separator of light modules. Without it, data modules touching the finder could confuse the scanner’s pattern recognition. The separator is what keeps the finder visually isolated.
Alignment Patterns
Starting from version 2, QR codes include one or more 5×5 alignment patterns. Their job is to counteract perspective distortion: if you photograph the code at an angle or the paper is curved, the scanner uses the alignment patterns to re-project the grid so the data modules line up again.
The number of alignment patterns grows with the code’s version: none for V1, one for V2-V6, six for V7-V13, up to 46 for V40. Their grid positions are fixed by the standard.
Timing Patterns
Two one-module-wide strips of alternating dark and light modules run between the finder patterns — one horizontally on row 6, one vertically on column 6. They act as a ruler: the scanner counts them to calibrate the exact module size at every position, compensating for lens distortion, uneven printing and camera resolution.
Quiet Zone
A margin of at least 4 modules of empty background must surround the code. This quiet zone is part of the spec, not a styling suggestion — it lets the scanner distinguish the code from whatever surrounds it. Skimping on it is one of the most common reasons real-world QR codes fail to scan.
Format Information
15 bits describe two things: which error-correction level (L / M / Q / H) is used, and which of the eight mask patterns was applied to the data. Without these two values, a scanner cannot even begin to decode the payload — so the format info is both placed twice (near the top-left finder and split across the other two) and protected with a BCH (15, 5) error-correction code. Up to three of the 15 bits can flip and the format info still decodes correctly.
Version Information
From version 7 onwards, 18 bits of version information appear near the top-right and bottom-left finders. For smaller versions the scanner can derive the version from the side length alone, but large codes benefit from an explicit, BCH-protected (18, 6) version field.
Dark Module
One module is always dark, regardless of the data: the module at column 8, row 4V+9, where V is the version. That’s row 13 column 8 for V1, row 17 column 8 for V2, and so on. It carries no payload and has no semantic meaning on its own, but its value is fixed by ISO/IEC 18004 and decoders use it as a known-dark reference.
Module Grid & Sizes
A QR code is a square grid of modules (black-or-white cells). The side length in modules is 21 + 4 × (V − 1) for version V: V1 is 21×21, V2 is 25×25, V3 is 29×29, and so on up to V40 at 177×177. See the Reference tab for a complete version table.
How Data Becomes a QR Code
From a string of text to a pattern of modules, a QR code goes through five stages: choose an encoding mode, build a bitstream, add error correction, interleave the codewords, and apply a mask. Each stage is reversible — that’s how scanners work the process in reverse.
1. Encoding Modes
Before the first bit of your payload is stored, the code picks an encoding mode. Different modes pack characters at different densities, so the right choice can shrink the code dramatically.
| Mode | Indicator | Character set | Bits / char | Example |
|---|---|---|---|---|
| Numeric | 0001 |
0-9 only | ≈ 3.33 (10 bits per 3 digits) | Phone numbers, IDs |
| Alphanumeric | 0010 |
0-9, A-Z, space, $%*+-./: |
5.5 (11 bits per 2 chars) | Uppercase URLs, SKUs |
| Byte | 0100 |
Any 8-bit byte (ISO-8859-1 / UTF-8) | 8 | Arbitrary text, URLs with lowercase |
| Kanji | 1000 |
Shift-JIS double-byte chars | 13 (per character) | Japanese text |
Mixed content: a single QR code may switch modes mid-stream to stay compact — e.g. numeric for a product code followed by byte for a URL slug.
2. The Bitstream
The payload is built as a single stream of bits, then chopped into 8-bit codewords. The layout of that stream is always the same:
- Mode indicator (4 bits) — which encoding mode was chosen.
- Character count (8-16 bits, depending on version and mode) — how many characters follow.
- Encoded data — the actual payload, bit-packed according to the mode.
- Terminator — up to four
0bits marking the end of data. - Padding — fills the remaining capacity with the repeating bytes
0xECand0x11. The pattern is arbitrary; what matters is that it’s predictable.
3. Error Correction Levels
QR codes are built to survive damage. A chunk of the capacity is always spent on error-correction codewords, and you get to pick how much:
| Level | Recovery | When to use |
|---|---|---|
| L (Low) | ~ 7% | Clean digital display, max capacity wanted |
| M (Medium) | ~ 15% | General-purpose default |
| Q (Quartile) | ~ 25% | Print on uncoated paper, logos in the center |
| H (High) | ~ 30% | Outdoor / industrial, rough handling, logos |
Higher ECL costs capacity: the same text in H needs a bigger code than in L. See the live comparison further down.
Where the Level Is Recorded
The chosen level is written into the format information — the 15 yellow modules above, placed in two copies so damage to one copy still leaves the other readable.
Within those 15 bits, only the top two (bits 14 and 13) — the pink modules immediately below each of the top-two finder patterns — carry the level. The remaining 13 bits hold the mask pattern index (3 bits) and a BCH error-correction code (10 bits) that protects the whole 15-bit string against bit flips.
| Level | Bits 14-13 | In QR | Recovery |
|---|---|---|---|
| L | 01 |
~ 7% | |
| M | 00 |
~ 15% | |
| Q | 11 |
~ 25% | |
| H | 10 |
~ 30% |
Note: before storage the 5 header bits (ECL + mask) are expanded to 15 bits via BCH(15, 5), then the whole string is XOR’d with the fixed pattern 101010000010010 so the format info can never accidentally resemble a finder. A decoder reverses the XOR, runs BCH correction, and reads the top two bits.
4. Reed-Solomon Error Correction
The redundancy behind error correction comes from Reed-Solomon codes operating over a finite field called GF(256). You don’t need the maths to use QR codes, but the one-sentence intuition is useful:
Treat the data codewords as coefficients of a polynomial. Reed-Solomon appends more coefficients so that any n missing or wrong values can be reconstructed from the rest — as long as the total errors stay under a known limit.
Practical consequence: you can punch a hole through a QR code, cover part of it with a logo, or print it on crumpled paper, and as long as the damage fits within the ECL’s budget, scanners recover the full payload.
5. Interleaving
Before being placed into the grid, data and error-correction codewords are interleaved in blocks. Why? A large scratch tends to destroy adjacent modules. By spreading codewords from different blocks across the code, no single burst of damage can wipe out a whole block’s-worth of error correction. It’s the same trick used on scratched CDs.
6. Zig-Zag Data Placement
The bitstream is written into the grid in a very specific order: two columns at a time, bottom-up, then top-down, zig-zagging up and down through the code, starting at the bottom-right corner and advancing leftward column pair by column pair. The finder, alignment, timing, format-info and version-info areas are skipped, and the vertical timing column (col 6) shifts the pairing by one.
This placement is deterministic — flip the process to decode. A handy trick: small tweaks to the payload move bits around predictably, which is why visually similar content can produce very different-looking codes.
7. Masking
If the raw bitstream happens to produce a pattern that looks like a finder pattern, or a big block of one colour, scanners will struggle. To avoid this, the encoder XORs the data modules with one of 8 standard mask patterns, then scores the result against a penalty function. The mask with the lowest penalty wins — and its index is stored in the format info so the scanner knows how to undo it.
The four penalty rules (simplified):
- Long runs of same-colour modules in rows / columns.
- Blocks of 2×2 same-colour modules.
- Patterns that resemble a finder (1 : 1 : 3 : 1 : 1 ratio).
- Overall imbalance between dark and light (should be near 50 / 50).
The 8 Standard Mask Patterns
These are the raw XOR patterns defined by ISO/IEC 18004 — not finished QR codes. During encoding, each pattern is XOR-applied to the data modules only, the results are scored against the penalty rules above, and the lowest-scoring mask wins. Its index (0-7) is then stored in the format info so decoders can undo the mask.
Live: L vs M vs Q vs H
Same payload (https://www.jpkc.com/tools/qr/), four error-correction levels. Notice how the code grows: more redundancy = more modules = larger print area required.
Live: Damage & Recovery
Same payload, both with ECL H. The left one is pristine; the right one has a chunk punched out — and still scans, because Reed-Solomon can reconstruct up to ~30% of missing codewords at this level. Try both with your phone.
Reference
Tables, character sets, content formats and a short list of standards — everything you’re likely to look up rather than read cover-to-cover.
Versions 1-40 — Grid Sizes
Every version adds 4 modules per side. Alignment pattern count grows roughly quadratically with the grid size.
| V | Size | Modules² | Align pts | V | Size | Modules² | Align pts |
|---|---|---|---|---|---|---|---|
| 1 | 21×21 | 441 | 0 | 21 | 101×101 | 10 201 | 22 |
| 2 | 25×25 | 625 | 1 | 22 | 105×105 | 11 025 | 22 |
| 3 | 29×29 | 841 | 1 | 23 | 109×109 | 11 881 | 22 |
| 4 | 33×33 | 1 089 | 1 | 24 | 113×113 | 12 769 | 22 |
| 5 | 37×37 | 1 369 | 1 | 25 | 117×117 | 13 689 | 22 |
| 6 | 41×41 | 1 681 | 1 | 26 | 121×121 | 14 641 | 22 |
| 7 | 45×45 | 2 025 | 6 | 27 | 125×125 | 15 625 | 22 |
| 8 | 49×49 | 2 401 | 6 | 28 | 129×129 | 16 641 | 33 |
| 9 | 53×53 | 2 809 | 6 | 29 | 133×133 | 17 689 | 33 |
| 10 | 57×57 | 3 249 | 6 | 30 | 137×137 | 18 769 | 33 |
| 11 | 61×61 | 3 721 | 6 | 31 | 141×141 | 19 881 | 33 |
| 12 | 65×65 | 4 225 | 6 | 32 | 145×145 | 21 025 | 33 |
| 13 | 69×69 | 4 761 | 6 | 33 | 149×149 | 22 201 | 33 |
| 14 | 73×73 | 5 329 | 13 | 34 | 153×153 | 23 409 | 33 |
| 15 | 77×77 | 5 929 | 13 | 35 | 157×157 | 24 649 | 46 |
| 16 | 81×81 | 6 561 | 13 | 36 | 161×161 | 25 921 | 46 |
| 17 | 85×85 | 7 225 | 13 | 37 | 165×165 | 27 225 | 46 |
| 18 | 89×89 | 7 921 | 13 | 38 | 169×169 | 28 561 | 46 |
| 19 | 93×93 | 8 649 | 13 | 39 | 173×173 | 29 929 | 46 |
| 20 | 97×97 | 9 409 | 13 | 40 | 177×177 | 31 329 | 46 |
Maximum Capacity (Version 40)
Worst-case payload the largest QR code can hold, per encoding mode and error-correction level.
| Mode | L (7%) | M (15%) | Q (25%) | H (30%) |
|---|---|---|---|---|
| Numeric | 7 089 | 5 596 | 3 993 | 3 057 |
| Alphanumeric | 4 296 | 3 391 | 2 420 | 1 852 |
| Byte | 2 953 | 2 331 | 1 663 | 1 273 |
| Kanji | 1 817 | 1 435 | 1 024 | 784 |
Alphanumeric Character Set
The alphanumeric mode is stricter than it sounds: lowercase letters are not allowed. Stick to this set and you save ~30% of bits per character vs. byte mode.
Common Content Formats
QR codes carry plain strings. To trigger actions on a phone, apps agreed on a handful of text conventions. The generator above implements the most common ones.
| Use case | Format |
|---|---|
| URL | https://example.com/ |
mailto:a@b.com?subject=Hi&body=... | |
| SMS | SMSTO:+1555...:Text or sms:+1555...?body=... |
| Phone | tel:+15551234567 |
| Geo location | geo:52.5200,13.4050 |
| WiFi (Android / iOS 11+) | WIFI:T:WPA;S:SSID;P:pass;; |
| vCard 3.0 | BEGIN:VCARD\nVERSION:3.0\nFN:...\nEND:VCARD |
| MeCard (compact) | MECARD:N:Doe,John;TEL:+1...;; |
| Calendar event | BEGIN:VEVENT\nSUMMARY:...\nDTSTART:...\nEND:VEVENT |
| Payment (EPC / SEPA) | 9-line text block starting with BCD |
Practical Tips
- Always keep the quiet zone. Four modules of background on every side. Violating this is the #1 reason real-world codes fail.
- Scan-distance rule of thumb: 10 : 1. A 2 cm code is reliable from ~20 cm, a 20 cm poster code from ~2 m, and so on.
- Contrast matters more than colour. Dark-on-light is safest; inverted (light-on-dark) is legal but not every scanner app handles it. Pure black / white is the most compatible.
- Use ECL H only when you need it. Adding a logo? Use H. Printing on glossy paper that will scratch? Use Q or H. Otherwise M is a sensible default.
- Shorten URLs before encoding. The difference between a 30- and 80-character URL is the difference between a tiny V3 code and a much larger one — and smaller codes scan faster and from further away.
- Test on real devices. iOS Camera, Android Camera, and the popular scanner apps each have quirks. A code that looks fine on your screen can fail when printed.
History & Standards
- 1994 — Invented by Masahiro Hara at Denso Wave (Japan) to track car parts on the Toyota assembly line. The name stands for “Quick Response”.
- 1999 — Published as the Japanese standard
JIS X 0510. - 2000 — Adopted internationally as
ISO/IEC 18004; still the authoritative spec today (current revision:ISO/IEC 18004:2024). - Micro QR — A smaller variant (11×11 to 17×17) for minimal payloads, one finder pattern only.
- rMQR (Rectangular Micro QR) — ISO/IEC 23941, rectangular shape for labels with constrained height.
- iQR, SQRC, Frame QR — Denso Wave’s own extensions: larger capacity, encrypted data, or an image-carrying frame.
- Denso Wave does not enforce the QR Code trademark on generators and readers — that’s a big part of why QR took off while competing 2-D barcodes didn’t.
Further Reading
- qrcode.com — Denso Wave’s official site, overview of QR variants.
- Wikipedia: QR code — comprehensive encyclopedic entry.
- qr.blinry.org — interactive walk-through of decoding a QR code by hand, highly recommended.
- Thonky’s QR Code Tutorial — long-form, step-by-step tutorial through the whole pipeline.