How do I design a QR code people will actually scan?
Use dark modules on a light background, keep a clear border, choose higher error correction if you add a logo, and test on several phones before printing.
A QR code scans well when a phone camera can tell the dark squares from the light ones in one quick glance. Strong contrast, a clear border, a code that is not crowded with data and a logo that stays small do most of the work. Then you test it on real phones before anything goes to print.
You can make QR codes in your client portal's QR code builder. The help article "How short links and QR codes work" covers that tool. This article covers the design rules that apply no matter which tool made the code.
The rules that matter most
- Dark on light. Print dark modules (the small squares) on a light background. Black on white is the safest. A dark brand color on white or cream also works when the contrast is strong.
- Keep the quiet zone. The QR code standard calls for a clear margin four modules wide on every side. Nothing goes in that border: no text, no photo, no edge of a card. Cropping it is one of the most common reasons a code fails.
- Do not invert it unless you have tested it. A light code on a dark background reverses what the standard expects. Some phone cameras read it and some do not. If your design needs a reversed code, test it on several older and newer phones first, or put the code on a light panel instead.
- Keep the data short. The more characters a code holds, the more modules it needs, and each module gets smaller at the same print size. A short link keeps the pattern simple and lets you change where it points later without reprinting.
- Pick the right error correction. QR codes can rebuild missing or damaged parts. The four levels recover roughly 7% (L), 15% (M), 25% (Q) and 30% (H) of the code. Level M is the usual choice. Use Q or H if the code may get dirty or scuffed, or if a logo covers part of it.
- Keep a logo small and centered. A logo hides modules, and error correction has to make up for them. Never cover the three large corner squares. A common rule of thumb is to keep a center logo under about a fifth of the code's area, use level H, and leave a little white padding around the logo.
- Avoid low-contrast styling. Gradients, pastel colors, photos behind the code and rounded or dotted modules can all look nice and scan badly. If you style it, test it.
- Use a vector file for print. Send the printer an SVG or PDF so the edges stay sharp at any size.
Test before you print
- Print a proof at the real size on the real paper or material.
- Scan it with at least three phones, including an older iPhone and an older Android phone, using the built-in camera app.
- Scan from the distance and angle a customer will actually stand at, and in the lighting where it will hang.
- Confirm the link opens the right page and that the page works well on a phone.
We can do this for you. Open a request in your client portal and our team will check a QR code design before it goes to print.
Common problems
- If the code scans on your phone but not a customer's, raise the contrast, make the code bigger and test on older phones.
- If the code will not scan at all, check that the quiet zone was not cropped or covered by other artwork.
- If the code stopped working after you added a logo, make the logo smaller, raise the error correction to H, or remove the logo.
- If it scans slowly from across a room, the code is too small for the distance. See "How big should a printed QR code be?" in this help center.
- If you need to change where the code points after printing, use a short link that you can edit instead of a code that holds the full web address.
Related articles
More in Design & brand basics
Still need help?
Ask our team