QR Code Generator | Custom Size, Colour, Error Correction

What it does

The QR Code Generator turns any text or URL into a scannable QR code. Four error-correction levels (L through H), tunable size, custom foreground and background colours, and adjustable quiet-zone margin produce a download-ready PNG. Encoding happens entirely in the browser; the payload — whether it is a URL, a Wi-Fi config, or an email handoff — never leaves the page.

Common situations

You’re producing print marketing materials — flyers, business cards, posters, packaging — and need a code that survives real-world wear. Higher error correction means the code can take coffee stains, scratches, and slight folding without becoming unscannable.

You’re running a campaign with a tracking-aware short URL (/promo/2026-launch) and want a QR code that points there. The code is part of out-of-home advertising, conference handouts, or printed receipts. Generating it once, sized appropriately for the medium, eliminates the slow phone-typing journey from physical to digital.

You’re adding a “scan to add Wi-Fi” code at a venue, an office, or a co-working space. The QR code encodes the SSID and password in a format phones recognise; guests scan, accept the auto-suggested network, no typing. Vastly more reliable than calling out “the password is alpha-bravo-romeo-…” in a noisy room.

You’re producing a vCard QR code for sales and event handouts. Recipients scan, the contact details land in their phone’s address book. Significantly higher conversion than printed business cards, which most people put in a drawer and never type up.

You’re building app-store-link discovery for a mobile product. The marketing site shows iOS and Android download buttons; physical materials need a single QR code. Pointing the QR at a smart-link service (Branch, Firebase Dynamic Links, or your own redirect) handles platform detection at scan time.

What you need to know

A QR code is a 2D barcode that encodes a string of bytes plus error-correction data, arranged in a square grid of black and white modules. The error-correction layer is what makes QR codes survive partial damage — a coffee stain, a scratch, a bent corner — by repeating the payload’s information in mathematically redundant form. The four error-correction levels correspond to roughly 7%, 15%, 25%, and 30% of the code’s capacity dedicated to recovery data.

Higher correction means the code can take more damage but also requires more modules to encode the same payload, which means the printed code needs to be larger or the modules smaller (and harder to scan). The right level depends on the medium: clean digital displays can use L; printed marketing on coated paper can use M; outdoor signage exposed to weather and physical wear should use Q or H.

The payload type affects encoding density. URLs encode efficiently; long URLs produce noticeably denser codes. Wi-Fi configs follow the format WIFI:S:<SSID>;T:<WPA|WEP|nopass>;P:<password>;;. vCards follow the standard vCard 3.0 format. Each phone scanner type recognises these and offers appropriate actions (open URL, join network, save contact).

Custom colours work as long as contrast remains high. Phones use a luminance threshold to decide which modules are dark and which are light; pure brand colours often work, but coloured-on-coloured combinations risk scanner failures. Test with multiple phone types before committing — older Android scanners are particularly strict about contrast.

Quiet zone (the white space around the code) is not decorative — scanners use it to detect the code’s edges. The standard recommends 4 modules of margin minimum; below that, scan failures spike. Crowding a QR code right up to surrounding text is a common error in print designs.

For printed media, the physical size matters as much as the digital one. A general rule: scan distance is roughly 10× the code’s printed width. A 1cm code scans reliably at 10cm; a 5cm code scans reliably at 50cm. Posters and signage that will be scanned from 2 metres need ~20cm codes — much larger than designers often expect.

Frequently asked questions

What is a QR code?

A 2D barcode that encodes text or URL data plus error-correction information. Modern phones (every iOS and Android device shipped after 2017) scan them natively from the camera app without a separate scanner.

What’s the best size for a QR code?

For printed media, scan distance is roughly 10× the printed width. A 2cm code is fine for handouts read at 20cm; a 10cm code scans reliably at a metre. For digital displays, 200–400px is typical.

What’s the difference between error-correction levels L, M, Q, and H?

L recovers from 7% damage, M from 15%, Q from 25%, H from 30%. Higher levels survive more wear but need more modules (so the code is denser or larger). M is the typical default for screens; Q or H for outdoor or print materials likely to take wear.

Can QR codes contain more than just URLs?

Yes — text, vCards, Wi-Fi configs, calendar events, geographic coordinates, and email pre-filled forms. Each format follows a recognised text pattern that scanners parse and offer appropriate actions for.

How do I make a Wi-Fi QR code?

Encode the text WIFI:S:<SSID>;T:WPA;P:<password>;; (replace SSID and password). Phones recognise the format and offer “Join this Wi-Fi” as an action. Useful for venue networks, office guest networks, conference Wi-Fi.

Do QR codes have a maximum length?

Yes, depending on error-correction level. At level L, up to ~4,300 characters of alphanumeric data. At level H, ~1,800 characters. Longer payloads need larger codes with smaller modules. URL shorteners help when payloads are long.

Can QR codes be branded with a logo in the centre?

Yes, but only at error-correction level H, which has enough redundancy to survive the logo overlay. Centre the logo over the code, leaving the QR’s three corner squares (the position-detection patterns) untouched. Test scannability after adding the logo — some logo sizes break the code.

Why does my QR code work on iPhone but not on Android?

Older Android scanners are stricter about contrast and quiet zones. Test on the oldest Android device in your audience. The fixes are usually higher contrast (avoid coloured-on-coloured), more quiet-zone padding, and ensuring the code is large enough.

Common problems

Problem: The QR code does not scan when printed, despite scanning fine on screen.

Print at higher error correction (Q or H), increase the printed size, and ensure quiet-zone margin of at least 4 modules. Glossy paper sometimes produces glare that breaks scans — matte stock scans more reliably outdoors.

Problem: Coloured QR code (brand colours) refuses to scan.

Contrast is too low. The dark modules need to be visibly darker than the light modules under the threshold scanners use. Use a near-black version of your brand primary on a near-white background — reversed (light on dark) often fails on older scanners.

Problem: QR code gets mangled by image compression in marketing email.

Email clients re-compress inline images aggressively. A heavily-compressed JPEG QR code may lose the sharp edges scanners need. Use PNG for QR codes in email; PNG’s lossless compression preserves the exact module boundaries.

Problem: Long URL produces a very dense code that fails to scan reliably.

Use a URL shortener (or your own short-link service) before encoding. A 50-character short URL produces a much sparser, more reliable code than a 250-character tracking URL with UTM parameters.

Problem: Logo in the centre breaks the QR code’s scannability.

The logo overlay must not cover the position-detection patterns (the three corner squares). Logo size should be 20–30% of the code’s diagonal at error-correction level H. Test on multiple phones after adding the logo.

Quick guides

For print marketing: Use error-correction level Q or H, contrast-high colours (near-black on near-white), 4-module minimum quiet zone, and a printed size of at least 2.5cm. Test against the oldest phone in your target audience before committing to print.

For Wi-Fi codes at a venue: Format the payload as WIFI:S:<SSID>;T:WPA;P:<password>;;. Use level M error correction (the code lives indoors, no wear). Place at chest height near the entrance for quick scanning.

For brand-coloured QR codes: Drop the foreground colour from your primary’s lightness to ensure ≥4.5:1 contrast against white background (or vice versa for light-on-dark). Test on Android — iOS is more forgiving on contrast.

Tips

Keep contrast high. Dark foreground on light background scans reliably; reversed (light on dark) works in modern phones but fails on older scanners.
The quiet-zone margin (white space around the code) is not decorative — scanners use it to detect the code’s edges. A margin of 4 modules is the minimum for reliable scanning.
Long URLs make denser codes. Use a URL shortener or a dedicated short domain when scan reliability matters more than vanity.
For codes that will live on physical media for years, prefer correction level Q or H. Print fades, surfaces wear, and the extra error-correction is the cheapest insurance available.
If a code might have a logo overlaid (centre badge), use H — the higher correction level is what allows the overlay without breaking scannability.
Print size matters as much as digital size. Scan distance is roughly 10× the printed width — plan accordingly for posters, signage, and packaging.

Related tools in this suite

The natural pairing is the Favicon Generator for web work and the Icon Set Generator for app work — print-and-screen identity assets often get generated together. The Colour Converter is useful when matching the QR foreground colour to a specific brand value defined in HSL or RGB.

Take it further

QR codes for tracked campaigns benefit from a redirect layer — instead of pointing the QR code directly at the destination URL, point it at a redirect you control. Then the campaign URL can be edited later without reprinting the codes, and you get usage analytics for free. The systems we build include short-link infrastructure as part of larger marketing-tech work where this kind of operational flexibility matters.