QR code generator with UTM, downloadable as SVG and PNG
Turn a link into a QR code for print, packaging and storefronts, with a UTM to measure visits and a contrast check so it scans well.
Your data never leaves your browser
QR code generator with UTM
Your QR code
Version 5, 495 × 495 px image, contrast 21.0:1.
https://shop.com/menu?utm_source=table&utm_medium=qr&utm_campaign=menu-2026
How to generate a QR code with UTM
A QR code is the bridge between print and screen: posters, packaging, menus, storefronts and business cards become a link one tap away. The problem is that, without a UTM, every visit coming from the code shows up in analytics as direct traffic, and you cannot tell which piece worked.
This generator builds the code in your browser, with an optional UTM on the link, a choice of error correction level, size and margin, and it checks contrast before allowing the download. The code is static: the link is baked into the drawing and cannot be changed later, so check it before you print.
- Paste the destination link. Use the final page, with https://. The shorter the address, the simpler and easier to scan the drawing is.
- Turn on the UTM to measure. Fill in source, medium and campaign. For printed material, a common pattern is the piece name as source (flyer, packaging), qr as medium and the action as campaign.
- Adjust error correction, size and margin. For print, use level M or Q and a margin of at least 4 modules. Raise the correction if the code will wear out or have a logo placed over it.
- Check the warnings and download. Pick SVG for print shops and any size, or PNG for web and documents. Test it with your phone before sending it to print.
Everything is calculated here, in your browser. Nothing you type is sent to any server and we use no third-party cookies.
What each option changes
Error correction, defined by the ISO/IEC 18004 standard, lets the code be read even when part of it is dirty or covered: L recovers up to 7% of the data, M up to 15%, Q up to 25% and H up to 30%. Higher levels make the drawing denser, with smaller modules.
The margin (quiet zone) is the empty space around the code. The standard asks for at least 4 modules; below that, many readers fail. The pixel size is adjusted to a whole multiple of the module so edges stay sharp.
The contrast between modules and background must be at least 4:1 (WCAG contrast ratio). Dark modules on a light background is the universal standard; inverted (light on dark) is refused by some readers, so the tool warns you.
- Error correction
L 7% · M 15% · Q 25% · H 30% of data recoverable - Minimum margin
4 modules of quiet zone - Minimum contrast
(L1 + 0.05) ÷ (L2 + 0.05) ≥ 4, with L = relative luminance - Image size
whole pixels per module × (modules + 2 × margin)
Examples
Menu on a restaurant table
Link to the menu page with a UTM of source table, medium qr and campaign menu-2026. Level M, margin 4, black on white, downloaded as SVG for the print shop.
Small package with a logo
Use level H, which tolerates up to 30% of data covered, and let the logo take only a small area in the center. Test scanning with more than one phone before printing.
Brand on a dark background
A dark blue (#102a43) on white has plenty of contrast. Light gray on white is refused with the low-contrast warning, because the code would not scan properly.
Frequently asked questions
How do I generate a QR code with UTM?
Paste the link, turn on the UTM and fill in source, medium and campaign. The code then opens the link with the parameters already in it, and the visit shows up in your analytics attributed to the campaign instead of direct traffic.
Does the generated QR code expire or count scans?
It does not expire, because the link is baked into the drawing itself. But it does not count scans either: measurement comes from the UTM in your analytics. To change the destination later, you would need a redirect on your own domain.
Which error correction level should I use?
For most cases, M (15%). Use Q or H if the code will sit on a surface that wears, have a logo over it or be printed very small. The higher the correction, the denser the code.
What is the minimum size to print?
As a rule of thumb, scanning distance is up to about 10 times the side of the code, so a 2 cm code scans well from about 20 cm. Long links make dense drawings and need more size.
SVG or PNG: which one should I download?
SVG is vector and stays sharp at any size, ideal for print shops. PNG is a fixed image, handy for websites, email and documents. The tool renders the PNG at whole multiples of the module so it does not blur.
Can I use colors or a logo in the QR code?
You can change the colors as long as contrast stays at 4:1 or more with modules darker than the background. For a logo, use correction Q or H, keep it small and test scanning.
Is the link I enter sent to any server?
No. The code is generated in your browser by an open-source library (uqr, MIT license), with no network request and nothing saved.
Related tools
WhatsApp link generator
Build the link that opens a WhatsApp chat with the message already typed, the number checked and the text encoded the right way.
WhatsApp link generatorUTM builder
Build campaign links in one consistent pattern and generate hundreds at once by pasting a list or CSV.
UTM builderURL inspector
Paste any campaign link and see its parameters, UTM mistakes and each platform's click identifiers.
URL inspector