QR — Tips & Tricks

Back to overview: QR · Open the live tool: www.jpkc.com/tools/qr/

Generating a QR code is quick — making sure it scans under real conditions is the actual craft. This page collects what matters. The technical background is in the manual.

Choosing the right error correction

The Error Correction level (L/M/Q/H) is the biggest lever for robustness — and a trade-off:

Higher level = more redundancy, but a denser code. H (~30%) survives dirt, creases and a logo; L (~7%) packs more content into a smaller code but is fragile.
Rule of thumb: display and clean print → M. Print on paper, small codes, rough environments → Q or H.
With a logo the choice is made for you: the moment you set a center image, the tool forces H and locks the field. That's deliberate, because the logo covers modules.

Don't forget the margin: the quiet zone

By spec, a QR code needs a calm, light area of at least four modules all around so the scanner can separate it from its surroundings. A missing or skimpy quiet zone is one of the most common reasons codes fail to scan in the field.

The tool handles this for you by default: the Quiet zone of 4 modules (recommended) toggle is on and calculates the margin to match the module count. Keep it on whenever you hand the code over as a finished file. Turning it off only pays off when your layout supplies the whitespace itself — say, because the code sits in a box with generous padding. If the manual margin gets too tight, the tool warns with "Quiet zone smaller than 4 modules", and the Use N px button restores the automatic with one click.

Keep in mind: the margin sits inside the edge length chosen under Size. A 350 px code with the automatic margin therefore has a slightly smaller module area than one without a margin.

Contrast decides whether it scans

QR scanners need clear light-dark contrast. The tool calculates it with the WCAG formula for every color pair of dots, custom corner colors and background, and warns below the preview:

Below 3:1 it reports "Low contrast" (red), below 4.5:1 "borderline" (yellow). For print and poor lighting, aim for 7:1 or more — black on white is 21:1.
Dark dots on a light background is the safe standard. The inverse (light dots on a dark background) works on many but not all devices — the tool warns with "Light code on a dark background (inverted)", and the scan test then reports "Only readable by scanners that support inverted codes".
With gradients, every color stop counts: the check takes the worst pair, so the lightest point of the gradient is measured against the background too.
A transparent background looks good in a layout but shifts responsibility for contrast onto the surface. In that case the tool measures against white — if your surface is darker, the result is too optimistic. Check the code on the actual material.

Logo: less is more

A logo turns the code into a brand, but every covered module costs robustness:

Keep Image Size around 30–40% rather than pushing the maximum (60%).
Leave Hide dots behind image on — it clears the modules under the logo cleanly.
With a logo the tool forces H; don't rely on that blindly. The scan test below the preview shows right away whether the logo covers too much — after that, test the code on several devices.
A logo costs capacity: level H holds at most 1273 bytes instead of 2331 at M. If the tool reports "Too much content", remove the logo or shorten the content.

SVG vs PNG/JPEG/WebP

Pick the export format by use:

SVG — lossless vector, scales freely, first choice for print and layout. Via Copy SVG it even goes straight into HTML or a design file.
PNG / WebP — raster formats with transparency; good for the web. Size sets the pixel resolution.
JPEG — raster format without transparency. Transparent areas (a transparent background, rounded background corners) turn black — with dark dots the code then becomes unreadable. Rarely the best choice for QR codes; if you do use it, only with an opaque background and no Corner Roundness.

Keep the content short

The more data, the higher the required QR version and the denser (and harder to scan) the code. The capacity line below the preview shows bytes, version and module count live — watch it while you trim. Practical consequences:

Shorten URLs instead of dragging along long tracking parameters.
For a vCard, fill only the fields you really need.
Special characters cost more: accented letters take two bytes in UTF-8, many emoji four. Pure ASCII text made of digits or capital letters, on the other hand, can be encoded more compactly.
If a long text still won't fit, lower the error correction as a test — or split the content differently.

Use the circle shape deliberately

The QR Shape: Circle option shrinks the complete code into the circle's inscribed square and fills the surrounding ring with decorative modules. It looks good but has two catches: the actual code gets smaller (edge length ÷ √2), and only one module stays clear between the code and the decorative modules — the automatic four-module quiet zone only applies outside the circle. Higher error correction doesn't make up for the missing quiet zone. So plan the circle shape larger than a square code and don't rely on the in-browser scan test alone — testing with real devices is what counts.

Always test on a real device

The scan test below the preview is a good first filter: it decodes the code in the browser and compares the result byte by byte with your content. But it checks a clean digital image — not a photo under artificial light, on glossy paper or from two meters away. That's why the tool adds "Cameras and print need more" to its success message whenever warnings are showing. Before any release or print:

test with several phones (iOS and Android) using each native camera,
for printed codes, scan a proof at real size,
mind the scan distance and lighting under which the code will actually be read.

Choosing the right content type

Raw text often does the job, but the templates save the person scanning some work:

Phone Call instead of a number as text — scanning offers to dial right away.
Location (Geo) instead of an address as text — the place opens in the map app.
Calendar Event instead of a date in running text — the event lands in the calendar. Fill in at least Title and Start; the times count as the phone's local time.
WiFi Network with WPA3 only (SAE) only for pure WPA3 networks; for transition mode, WPA/WPA2 (also WPA2/WPA3 mixed) remains the right choice.

Combine with other JPKCom tools

Cryptor (AES-256) — produce a short ciphertext and pass it on as a QR code; transmit the password separately.
Password & key generator — produce a strong string to distribute as QR content. The generator shows WiFi keys and TOTP secrets with their own QR code right away; for a styled WiFi notice, enter the password here under WiFi Network.
Graphics tools — get a logo to the right size and format before using it as a center image.

The full reference is in the manual, concrete walk-throughs in the examples. You can try it all in the tool.