💻 Coding

QR Code Generator

Type any text or URL and get a real, scannable QR code that updates live as you type, ready to download as a PNG.

Enter some text or a URL above to generate a QR code

About the QR Code Generator

Whatever you type gets encoded into a genuine QR code (with real Reed-Solomon error correction and mask-pattern selection handled by the qrcodejs library) that any phone camera can scan, not just a pattern that merely looks like one. It regenerates a short moment after you stop typing so it doesn't redraw on every keystroke, the error-correction level trades a denser pattern for more damage tolerance, and the whole thing runs client-side with no data sent anywhere.

What L, M, Q, and H actually stand for

Those single letters in the Error Correction dropdown are shorthand for Low, Medium, Quartile, and High, the four standardized recovery levels defined in the QR code specification. Each percentage represents roughly how much of the code's total data area could be damaged, smudged, or obscured (by dirt, a logo overlay, a crease, partial tearing) and the code would still scan successfully. Low tolerates about 7% damage, High tolerates around 30%, using Reed-Solomon error correction, the same class of mathematical redundancy technique used in CDs, DVDs, and satellite data transmission, which adds extra, calculated data blocks that let a scanner mathematically reconstruct missing or corrupted portions rather than simply failing to read them.

Why higher error correction makes the code visually denser

That recovery capability isn't free, it comes from encoding additional redundant data alongside your actual content, which means the same text produces more total modules (the individual black/white squares) at a higher correction level than at a lower one. That's why switching from L to H for identical input text visibly makes the pattern look busier and more intricate, you're looking at more encoded redundancy, not more of your original content. For a QR code that will live on a printed poster, sticker, or business card, where dirt, wear, or a small logo overlay are realistic, a higher correction level is worth the extra visual density. For a code displayed cleanly on a screen or in a pristine digital document, a lower level keeps the pattern simpler without meaningfully increasing scan failures.

Why the pattern isn't just your data drawn directly

Before finalizing the code's appearance, the QR standard requires applying one of eight predefined "mask patterns," an XOR operation layered over the raw encoded data specifically to avoid visual patterns that could confuse a scanner, large solid blocks of one color, or sequences of modules that accidentally resemble the distinctive square finder patterns in the code's corners. The encoding library automatically tests all eight mask options against a standardized penalty-scoring system and picks whichever one produces the cleanest, most scanner-friendly result. This selection happens invisibly every time you generate a code, it's part of why two QR codes encoding very similar text can still look meaningfully different from each other.

Why generation waits briefly after you stop typing

Encoding text into a QR code (calculating error correction blocks, testing all eight masks, rendering the final grid) is genuinely more computational work than most simple live-preview tools, so regenerating on every single keystroke would be wasteful and could feel laggy on longer input. Instead, this tool waits 250 milliseconds of typing inactivity before running a fresh generation, batching rapid typing into far fewer actual encode operations while still feeling responsive once you pause.

Why the download logic checks for two different element types

The QR rendering library can output its result as either a <canvas> element or an <img> element depending on internal implementation details, so the download handler checks for both, reading image data from whichever one actually got rendered, rather than assuming a single fixed output format. This defensive check is what keeps the Download button working reliably regardless of which rendering path the library happens to take.

Frequently Asked Questions

What do the L, M, Q, H error correction levels stand for?

Low, Medium, Quartile, and High. Each represents roughly how much of the QR code's data area can be damaged or obscured, from about 7% at Low to about 30% at High, and still scan successfully, using Reed-Solomon error correction to reconstruct missing data.

Why does a higher error correction level make the QR code look more complex?

Higher recovery levels encode additional redundant data alongside your actual content, producing more total modules for the same input text. The extra visual density is redundancy for damage tolerance, not more of your original content.

Which error correction level should I use for a printed sticker or poster?

A higher level (Q or H) is worth the added visual density for anything that might get dirty, worn, creased, or partially covered by a logo. For a QR code displayed cleanly on a screen, a lower level (L or M) keeps the pattern simpler without meaningfully increasing scan failures.

Why do two QR codes with similar text sometimes look quite different?

The QR standard requires applying one of eight predefined mask patterns to avoid scanner-confusing visual artifacts like large solid blocks. The encoder automatically tests all eight and picks the best-scoring one, so small text differences can lead to a different mask being selected.

Why doesn't the QR code update instantly on every keystroke?

Encoding text into a QR code involves real computational work, calculating error correction data and testing eight mask patterns, so the tool waits 250 milliseconds after you stop typing before regenerating, avoiding unnecessary recalculation on every single keystroke.

Does this tool send my text or URL anywhere to generate the QR code?

No, the entire encoding process runs locally in your browser using the qrcodejs library. Nothing you type is uploaded to a server.