FreeToolio

QR Code Generator with Logo

Drop your logo into the middle of a static QR code — the pattern, the white plate and both downloads are made in this tab. No account, no watermark, nothing uploaded.

Your logo stays in your browser · static codes that never expire · level H by default · no account · no watermark

QR Code with a Logo: The White Box Costs More Than the Mark

Put your logo in the middle of a QR code and download it. The pattern, the plate behind the logo and both files are made in this tab: no upload, no account, no watermark, and nothing that can expire.

The useful part is knowing how much middle a code can lose. On the 50-character link used for the measurements below, a logo at 20% of the width broke the code at the lightest error correction and read cleanly at the strongest. The white plate behind the mark, not the mark itself, was the expensive half.

Two QR code grids of the same 50-character link, each carrying the same 20% logo inside a white plate 22.4% of the width. The level L code is 29 modules across and none of eight decode passes returned the link; the level H code is 41 modules across and all eight did.
One link, one logo, one plate at 22.4% of the width. At level L the 29-module code lost the link in all eight decode passes; at level H the 41-module code returned it in all eight. The plate is the same share of the width in both.

How to put a logo in a QR code here

  1. Type the destination. A link, plain text, or a Wi-Fi string — the box above accepts any of them.
  2. Add the logo. Drop a PNG, JPG, WebP or SVG on the logo box, or paste an image with Ctrl + V. It is read by the browser and never leaves the device.
  3. Set the width. The slider runs from 8% to 40% of the code's width. 20% with error correction H is the default, and it is the setting measured through every test below.
  4. Download. PNG for screens and office printers, SVG when the printer wants vector art.

What each control does

Error correction. L, M, Q and H set how much of the pattern can be rebuilt after damage: about 7%, 15%, 25% and 30% of the codewords. A bigger level makes the code denser, so each square gets smaller at the same download size. This page opens on H because a logo is deliberate damage.

Logo size. The percentage is the width of your artwork; the plate around it is 12% wider, six percent of padding per side. At a 20% setting the plate measures 22.4% of the code's width, and the line under the preview reports both.

White plate. On by default. It clears the modules behind the logo so the mark reads against white instead of against black squares. Turning it off leaves the pattern under a transparent logo: more of the code survives, and the mark looks busier.

Download size. 256, 512 or 1024 px. Modules are drawn as whole pixels and any leftover is split into the quiet zone, so the number in the menu is the exact width of the file.

PNG or SVG. The PNG is a fixed grid of pixels, fine up to a few centimetres; the SVG is one path plus the logo as an embedded image, so it scales to a poster without softening.

A logo is a hole, and the level decides how big a hole fits

The same 50-character link, made at four levels, with a centred square logo whose width sweeps from 8% to 36% of the code:

Level Version Modules Logo at 20% Largest logo that still decoded
L 3 29 × 29 5.8 modules 16%
M 4 33 × 33 6.6 modules 24%
Q 5 37 × 37 7.4 modules 32%
H 6 41 × 41 8.2 modules 36%

Each entry is the widest setting at which every one of eight decode passes returned the link: two decoders (jsQR 1.4.0 and ZXing 0.21.3), on a crisp 512-pixel render, a 256-pixel copy, a 300-pixel photo simulation and a 200-pixel photo simulation. The photo simulations add a sub-pixel blur and a JPEG pass, which is the closest this test gets to a phone camera looking at paper.

Two honest caveats. At level Q the decoders disagreed on crisp renders: jsQR read every one, while ZXing refused them at logo widths up to 24% and then read the 28% and 32% versions. The photo simulations agreed with jsQR, so the Q row leans on those. And 36% is simply where the sweep stopped: for H the limit was not reached on this link.

What the table says in plain terms: at L, a logo at 16% of the width is the most this link can carry, and 20% already kills it. At H the same link survived a logo at 36% of its width, the largest size tested.

One number needs separating before any of this is usable: percent of what? Twenty percent of the width is four percent of the area, because area grows with the square. A budget quoted as a quarter of the area is therefore about half the width. The percentages on this page are width, because width is what the slider moves and what you can measure on a printed sheet with a ruler; the line under the preview also prints the plate's width share, so the two never get mixed.

The plate, not the artwork, is what eats the code

Run the same sweep with the plate switched off, so only the dark strokes of the logo cover the pattern, and the results move the other way. In 56 side-by-side comparisons (seven logo widths, four levels, two links), 43 decoded the same number of passes, the plate-free logo decoded more in 11, and the plated logo more in 2.

The extreme case is level L with a 20% logo. With the plate on, all eight decode passes failed. With the plate off the same artwork at the same size read in all eight.

The mechanism is arithmetic, not mystery. A white plate erases every module under a solid rectangle: at a 20% setting the plate covers 22.4% of the width, about 5% of the symbol's area, and the code has to rebuild all of it. A logo without a plate erases only what its own strokes cover, which for a letterform is a small fraction of that box. Both are damage; one is four or five times larger than the other.

That does not make the plate wrong. A logo sitting directly on black modules is hard to recognise, and the whole point of putting it there is recognition. What the numbers change is the size dial: the plate is the real footprint, so pick a percentage with the plate's width in mind, and keep it well below the ceiling the level allows. Ten points of headroom costs nothing in appearance and buys room for a faded print, a curved surface or a cheap camera.

Where it actually fails: when the code gets small

The drop from 512 pixels to 200 pixels is where the physical limits show up, and the logo is not always the reason.

Take the long link, 113 characters, at level H. It becomes version 10: 57 modules across, 65 with the quiet zone. Rendered at 200 pixels that is 3.1 pixels per module, and every setting of the logo, including 8%, failed to decode after the blur and JPEG pass. The same link at 300 pixels, 4.6 pixels per module, read at every logo size up to 36%.

The 53-module version at level Q, 3.3 pixels per module in the same 200-pixel scene, still read. So the real boundary is a few pixels per module, not a percentage of logo.

Print puts the same limit in millimetres. At 2 cm wide, a 41-module version 6 code gives each square 0.41 mm, while the 57-module version 10 gives 0.31 mm. The distance rule of thumb is ten times the code width for a comfortable scan, so a code read from 30 cm wants to be about 3 cm wide; at that size the 57-module code has 0.46 mm squares and the 41-module one has 0.61 mm. Higher error correction makes the code denser, which is why a code with a logo needs to be printed larger, not merely at the same size.

What the files weigh

The same 50-character link, saved as PNG at 512 px:

Level No logo Logo 20% Logo 26%
L 8,463 B 9,150 B 9,732 B
M 8,865 B 9,849 B 10,512 B
Q 9,255 B 10,389 B 10,671 B
H 9,753 B 10,671 B 11,325 B

The logo adds about 0.9 KB at 20% and 1.6 KB at 26% on the level-H code, because the plate and the mark are a few thousand pixels that were flat white and now are not. The level itself costs 1.3 KB from L to H on a code with no logo at all.

The SVG for the same H code with a 20% logo came out 21,330 bytes. Most of it is the pattern: one path holding 852 square subpaths, 11,668 of those bytes. The logo is embedded as a 320-pixel PNG, 9,266 bytes of base64. Nothing in the file is a bitmap of the code, so a printer rasters the squares at its own resolution; the mark in the middle is the only raster element.

Why there is no upload here

The pattern is generated by JavaScript in this tab, the plate is a shape drawn on a canvas, and your logo is read from the file picker straight into an image object. Nothing is sent anywhere: load the page, disconnect the network, and it still composes codes with your logo. The technique is the same one described in how to check any tool for uploads.

This page encodes the destination itself, so it makes static codes: no scan counts, no editable destination, nothing to switch off. The plain generator covers that trade in full.

Questions people ask before printing

Where exactly does the logo go? Dead centre, and it stays there at every size. The quiet zone, the three corner squares and the timing lines are never touched; the plate only ever covers the data area in the middle.

How big can a logo be before phones stop reading it? On this link, at H, 36% of the width still decoded in every pass, and at L the ceiling was 16%. Treat those as the edges of a measured range, not a target: a 20% logo at H sits far inside it, with room for ink spread and a tired camera.

Can I use a transparent PNG as a logo? Yes, and it is the gentler option. Turning the plate off leaves the modules visible around the strokes, which is why the plate-free logo out-decoded the plated one in eleven of the comparisons. Photograph-ready logos usually look better with the plate on; test both if the code will be printed small.

Does the code expire? No. The link is encoded in the pattern itself, so there is no redirect, no account and no renewal. If the destination moves, the code points at the old address.

Why does it scan on screen but not on paper? Usually size, not the logo: below roughly three pixels per module in a photographed image, or below about 0.3 mm per module in print, the modules stop resolving. Print the code bigger before shrinking the logo.

Do I have to keep the 4-square border? Yes. The quiet zone is part of the specification, four modules of empty space on every side, and cropping it is the fastest way to turn a working code into a dead one.

Is a logo QR still a static code? Yes, as long as the tool encodes your destination directly. The logo is drawn on top of the pattern after generation; it is not a redirect, so no third party can turn the printed code off.