Artistic QR codes: blending a picture into a scannable code

Artistic QR codes keep each module's average brightness while varying the detail inside it, so a picture shows through and a scanner still reads the same data.

5 min read · Updated

Most “AI QR art” you have seen was generated by a diffusion model on someone else's server, and about half of it does not actually scan. The halftone approach is more modest and far more reliable: it never invents pixels, it only decides how to shade the ones the code already owns.

Why it works

A scanner does not measure every pixel. It samples each module and asks one question: is this square mostly dark or mostly light? That leaves room underneath. If a module has to read as “dark”, it can be a solid black square — or a dense cluster of black dots with a little of your photograph showing through. Both average out dark, so both decode the same.

Split every module into a 3×3 grid of sub-pixels, keep a solid anchor dot in the centre so the module's identity is never in doubt, and use the surrounding eight to carry image detail. You get a picture at the resolution of the sub-grid and a code that still reads.

Make one

  1. Open QR art and enter the link. Keep it short — every extra character shrinks the modules and therefore the picture.
  2. Upload an image. High-contrast subjects work; busy, flat or low-contrast ones do not.
  3. Move the blend slider up until the picture reads, then back off as soon as the scan self-test badge stops passing. That badge is a real decode of the rendered canvas, done in your browser.
  4. Export the PNG and test it on a phone before you use it anywhere.

Error correction is forced to H for artistic codes, which is why they tolerate this treatment at all.

Choosing an image

  • Strong silhouettes win. A face, a logo shape, a single object against a plain background. The picture survives as tone, not as detail.
  • Avoid fine text and thin lines. At three sub-pixels per module they disappear entirely.
  • Mid-tones are where the effect lives. A photo that is mostly pure black or pure white leaves the halftone nothing to modulate.
  • Crop square and centre the subject. The middle of the code carries the most visible area.

The honest trade-off: the more picture you let through, the closer each module drifts to the decision boundary. An artistic code will always be less robust than a plain one — so use it where scanning conditions are good, and keep a plain code for packaging that has to work in a dim warehouse.

Where artistic codes belong

They earn their keep on posters, album covers, event invitations, social posts and merchandise — places where the code is also a graphic and someone is standing still in decent light. They are a poor fit for menus in dark restaurants, small labels, and anything scanned in a hurry.

Nothing leaves your device

The halftone engine, the encoder and the decoder all run in your browser. Your photograph is never uploaded, so there is no model training on it, no queue and no per-image cost — and the whole page keeps working offline once loaded.

Softer alternatives

If the picture is fighting the code, back off a step. Module shapes, gradients, per-eye colours and a captioned frame restyle a code without removing any data, and a centred logo gives you brand recognition at a fraction of the risk. Start there, and reach for halftone when the code itself needs to be the artwork.