As of October 8, 2026
What a QR code can recover
When we add a logo to a QR code, we are deliberately covering part of the symbol. That sounds like an error, because it is one. The reason a phone can sometimes read the result is that QR codes encode redundant information using Reed–Solomon error correction. We build free web tools, and this is one of the places where understanding a small technical detail makes a large practical difference.
QR codes offer four commonly named error correction levels: L, M, Q, and H. Higher correction adds redundancy, but it also takes capacity. Given the same content, a higher level may require a denser symbol. The percentages typically associated with each level describe approximate recoverable damage to codewords, not a guarantee that a logo covering that percentage of the visible square is safe.
| Level | Approximate recovery | Typical decision |
|---|---|---|
| L | 7% | Clean, unobstructed environments |
| M | 15% | General-purpose codes |
| Q | 25% | Modest decoration with testing |
| H | 30% | More margin for a centered logo |
A central logo is particularly unforgiving when it overlaps functional patterns or when the code is already dense. The three large position markers, their surrounding quiet regions, and other structural elements are essential. Error correction cannot repair every arbitrary shape of damage.
A minimal implementation
The familiar open-source JavaScript qrcode package allows a level to be selected explicitly. For a simple test page, an example looks like this:
import QRCode from "qrcode";
const destination = "https://example.org/info";
const pngDataUrl = await QRCode.toDataURL(destination, {
errorCorrectionLevel: "H",
margin: 4,
width: 640,
});
document.querySelector("#preview").src = pngDataUrl;
This example generates a normal QR image. It does not add a logo or prove that one is safe. If your UI overlays a logo afterward, you need a separate scan test of the finished composite. Keep the destination short when possible, because longer payloads can produce more modules. Test with multiple phones, camera distances, and lighting conditions, including the worst case you expect on paper.
The margin option matters too. A QR code needs a quiet zone, usually at least four modules of uninterrupted background around the symbol. Cropping tightly for visual balance can break recognition even when the central data remains untouched.
Static payloads versus redirect services
A static QR code contains the destination itself, such as a URL, Wi-Fi configuration, or contact fields. A redirect-based dynamic service commonly puts its own short URL in the symbol and forwards scans to the destination configured on its server. That approach can make the destination editable, but it also adds a service dependency.
People often say a static QR code never expires. More precisely, the encoded data does not carry a service-imposed expiration date. The destination website can still shut down, a domain can lapse, a Wi-Fi password can change, or an event can end. The pattern on the page stays the same, but what it points to may stop working.
For a long-lived poster, we prefer an address the publisher controls. We also suggest printing the human-readable URL nearby. A scan failure should not make the information inaccessible.
PNG or SVG for production?
PNG is a raster image. Its quality depends on the exported pixel dimensions relative to the size at which it is printed. A sufficiently large PNG can work perfectly well on a small card, but enlarging a small export introduces blurry edges. SVG uses vectors, so a designer can scale it to a larger sign without interpolation blur.
Neither format rescues poor contrast, an undersized quiet zone, or an excessively ornate mark. Dark modules on a light background remain the safest starting point. Color combinations should be inspected in grayscale as well as on screen. A glossy surface or reflected light can undermine an apparently strong design.
When handing files to a print shop, communicate the final physical dimensions. Exporting a huge bitmap without knowing the target size is less useful than confirming the final module size and printing a proof.
Our review routine before putting a QR code in public
We first generate an undecorated version and scan it. Then we raise the error correction level if a logo is necessary, keep the logo compact, and scan the resulting composition. We check the printed proof rather than trusting a monitor preview. Finally, we verify the exact payload, including capitalization and punctuation in the destination URL.
We treat QR codes as interfaces, not decoration. Their job is to transfer a small piece of information reliably. A beautiful code that nobody can scan fails that job.
FAQ
Does level H guarantee that a large logo will scan?
No. H adds more recovery capacity, but location, density, contrast, printing, and decoder behavior still matter. The finished code must be tested.
Does a static QR code need an account or monthly renewal?
The encoded pattern needs neither. Whether the resource at the destination remains available is a separate question.
Which download should we use for a poster?
SVG is convenient for scaling in a print layout. A large, sharply rendered PNG may also work when the final dimensions are known.
We made a free browser-based QR generator with nine payload types, options for logos, colors, and shapes, and PNG or SVG downloads. Codes are generated in the browser without a redirect layer; it also includes a separate group check-in room feature. Try the free QR generator.
Top comments (1)
When adding a logo, does the SVG export keep it vector, or embed it as a bitmap?