Build a QR code that actually scans
A QR code for a menu, a business card, a flyer or a product has to survive being branded and being printed small — two things that quietly break scanning. These six tools take you from getting the payload right, through adding a logo without exceeding the error-correction budget, to proving the finished code still reads at its real physical size.
The short answer
To build a QR code that scans reliably once printed: get the payload format exactly right first (a mistyped Wi-Fi or vCard string decodes to nothing useful), keep any logo or colour inside the error-correction budget — L tolerates about 7% of the code obscured, H about 30% — decode your own finished code to confirm it still reads what you intended, and work out the minimum print size from its pixel dimensions and DPI before it ships. Most codes that fail in the wild are either over-branded or printed too small, not badly generated.
Decide what it actually encodes
text, a link, wifi, or a contact cardA QR code is only as good as the payload inside it, and getting that payload's format right matters more than anything visual. A branded code that encodes a broken string is a broken code.
Brand it without breaking it
logo, colour, and the scanner's toleranceAdding a logo or colour works, but only within the error-correction budget — push past what the redundancy can spare and the code stops scanning no matter how good it looks.
Prove it survives print
before it goes anywhere physicalA code that scans perfectly on a laptop can fail once it's shrunk onto a flyer or a table tent. Verify both the payload and the physical size before it ships.
The payload is the part that actually fails
The visual design of a QR code gets all the attention, but the thing that most often makes one useless is invisible: the string encoded inside it. A code is a picture of text, and if that text is malformed the scanner either decodes it to nonsense or does nothing at all.
Straight URLs and plain text are hard to get wrong. Structured payloads are where it goes sideways. A Wi-Fi code isn't free text — it follows a strict grammar, roughly `WIFI:T:WPA;S:<ssid>;P:<password>;;`, and any semicolon, colon, comma, quote or backslash inside the SSID or password has to be escaped. Miss one and the payload decodes to the wrong credentials entirely, which reads to the person scanning as "this code is broken." QR Code Generator builds the Wi-Fi string for you so the escaping is handled rather than hand-typed.
A contact code has the same shape of problem. Build the vCard content first with vCard Contact File Generator — an RFC-compliant .vcf, version 3.0 or 4.0 — and encode that verified block, rather than assembling contact fields by hand inside a QR tool and hoping the phone parses them.
- 1An unescaped character in a Wi-Fi password
A password like `p@ss;word` contains a semicolon, which is the field separator in the Wi-Fi grammar. Unescaped, the payload ends the password early and the phone joins with the wrong key.
- 2Encoding contact fields by hand
Contact cards have a required structure. Generate a valid vCard first, then encode it — don't type name and phone straight into a QR box and assume any scanner will reconstruct a card from it.
A logo is a controlled amount of damage
The reason you can drop a logo into the middle of a QR code at all is error correction. Every QR code carries redundant data so it still reads when part of it is obscured or scuffed, and there are four levels of it: L tolerates roughly 7% of the code being lost, M about 15%, Q about 25%, and H about 30%. A centre logo is simply deliberate, pretty damage — as long as it stays inside that budget, the redundancy reconstructs what it covers.
That budget isn't free, though. Higher error correction means more redundant data, which means a denser grid for the same payload — and a denser grid needs to be printed larger to stay resolvable. So branding and print size pull against each other: the logo you add at level H is survivable precisely because the code got busier, and a busier code fails sooner when shrunk.
QR Code Style Tool handles the colour, the rounded or dot module shapes and the centre logo. Prep the logo before you drop it in: a company mark with a white or coloured box around it sits badly on the module pattern, so run it through Background Remover first to get a clean transparent PNG that lets the surrounding modules show through.
- Setup
- Logo scaled to cover roughly a third of a code generated at error-correction level M
- On screen
- Scanned fine — the phone had a large, sharp image to work from
- Printed
- Same logo now obscured more than M's ~15% budget could reconstruct at business-card size
- Fix
- Raise error correction toward Q or H, shrink the logo, and re-check the physical size
The logo didn't change — the tolerance did. A big logo needs a high error-correction level, and a high level needs a larger print. Decode the final artwork with QR Code Decoder before trusting it.
Prove it before it prints
Two checks stand between a code that looks right and a code that works, and both take under a minute.
The first is a round-trip. Decode your own finished artwork with QR Code Decoder and confirm it reads back exactly what you meant to encode — same URL, same Wi-Fi credentials, same contact card. This matters most after adding a logo, because that's the step most likely to have quietly pushed the code past its tolerance. If the decoder can't read it cleanly on a big sharp screen, a phone camera at arm's length has no chance.
The second is physical size. A code shrunk below a certain size at a given scan distance becomes unreadable to a phone camera regardless of how correct the data is. Image Print Size Calculator does the exact arithmetic — print size in inches equals pixel dimension divided by DPI — so you can work out how big your code's pixels land at print DPI, or reverse it to find the pixels you need for a target physical size. Decide that size before the artwork goes to press, not after the flyers come back.
Which one do I want?
Several tools here overlap. The short version:
| QR Code Generator vs QR Style Tool | A plain code, no logo — SVG that stays crisp at any print size. | A branded code — centre logo, colours, module shapes, output as PNG. |
|---|---|---|
| QR Style Tool vs Background Remover | Composing the branded code itself — logo, colour, shape. | Prepping the logo first — stripping its background to transparent. |
| QR Code Decoder vs Image Print Size Calculator | Confirming the finished code still reads what you encoded. | Confirming it's large enough to read once it's printed. |
| QR Code Generator vs vCard Contact File Generator | Encoding a link, Wi-Fi or plain text into the code. | Building the contact block that a digital business-card code carries. |
Why this set
Generating, styling, decoding and the print maths all happen in your browser. Nothing you encode — a Wi-Fi password, a personal contact card — is uploaded anywhere.
The whole workflow assumes the code ends up on paper or a product, where branding and size actually decide whether a phone can read it.
The decode-and-measure checks at the end cost under a minute and are far cheaper than reprinting a batch of flyers whose code nobody can scan.
Questions
Why does my QR code scan on screen but not when printed?
Almost always size or branding, not the data. On a screen the phone has a large, sharp image; printed small, the same code offers far less for the camera to lock onto. If you've added a logo, it may also be obscuring more of the code than the error-correction level can reconstruct at that physical size. Decode the artwork first, then work out its minimum print size before committing.
How big can a logo be before the code stops scanning?
It depends on the error-correction level. L tolerates roughly 7% of the code being obscured, M about 15%, Q about 25% and H about 30%. A centre logo has to stay inside that budget. Raising the level lets a bigger logo survive, but it also makes the code denser, which means it has to be printed larger — so there's a real trade-off, not a single safe number.
Why did my Wi-Fi QR code connect to the wrong network or fail?
A Wi-Fi payload follows a strict grammar where semicolons, colons, commas, quotes and backslashes are special characters. If your SSID or password contains one of those and it isn't escaped, the string decodes to the wrong credentials entirely. Generating the Wi-Fi code with a tool that handles the escaping avoids this — typing the grammar by hand is where it breaks.
Should I use the plain generator or the branded style tool?
Use the plain generator when you want a code that stays crisp at any size and don't need a logo — it outputs SVG, which is vector and scales without blurring. Use the style tool when you want a centre logo, custom colours or module shapes; it outputs PNG because it composites those raster effects. If you need both a very large print and a logo, plan around that trade-off.
How do I know how big to print a QR code?
Start from the pixel dimensions and target DPI: print size in inches equals pixels divided by DPI. Run that through a print-size calculator to see the physical size your code lands at, or reverse it to find the pixels you need for a chosen size. Denser codes — more data, or a high error-correction level for a logo — need to be printed larger to stay readable at the distance people will scan from.