How to use it
- Choose the type. For a link, paste the address – a bare domain gets
https://added automatically. - Fill in the fields. Wi-Fi needs the network name and password; a contact needs at least a name.
- Pick the size and error-correction level; change the colours if you must, keeping the code dark on a light background.
- Scan the preview with your phone to verify it, then download the PNG or SVG (or copy the PNG).
Example
A Wi-Fi code for network HomeNet with WPA2 password secret123 encodes the text WIFI:T:WPA;S:HomeNet;P:secret123;;– 34 bytes, which fits a tiny version-2 symbol at level M. Scanning it with the iPhone camera (iOS 11+) or Android camera / Google Lens offers to join the network without typing the password. For a poster, export the 1024 px PNG and keep the quiet zone so the code stays readable from a distance.
How the codes are built
The pattern is produced by qrcode.react, an implementation of the ISO/IEC 18004 QR specification: the payload is split into numeric, alphanumeric or byte segments, Reed–Solomon error-correction codewords are added for the chosen level, and the smallest symbol version (1–40) that fits is used. Byte-mode capacities at version 40 are:
L 2,953 bytes · M 2,331 bytes · Q 1,663 bytes · H 1,273 bytesThe content itself follows the conventions phone cameras understand:
- Wi-Fi:
WIFI:T:WPA;S:ssid;P:password;H:true;;(ZXing format;\ ; , " :in the name or password are escaped with a backslash). - Email:
mailto:with percent-encodedsubjectandbody(RFC 6068). - Phone:
tel:+15551234567(RFC 3966); spaces, dots and dashes are removed. - SMS:
SMSTO:number:message, the ZXing form that both iOS and Android open in Messages. - Contact: vCard 3.0 with
N,FN,TEL,EMAIL,ORGandURLlines (RFC 2426).
Colours are checked with the WCAG contrast formula: below 4:1 many scanners fail, and a light code on a dark background (inverted) is unreadable to some apps, so both cases show a warning. The quiet zone is the four-module blank margin the standard requires around every symbol.
Sources: ISO/IEC 18004 – QR Code bar code symbology specification, ZXing – Barcode contents (Wi-Fi, SMSTO, vCard conventions), RFC 6068 – the mailto URI scheme, RFC 3966 – the tel URI, qrcode.react on GitHub.
Which error-correction level should I use?
M (15%) for screens and ordinary prints. Choose Q or H when the code will be printed small, laminated, placed outdoors or partly covered by a logo – each step adds modules, so the symbol gets denser and needs to be printed larger. L (7%) only when the content is long and the code will be displayed clean and large.
Questions
- Do these QR codes expire or stop working?
- No. The code contains the data itself (the link, the Wi-Fi details), not a reference to a server, so it works as long as the content it points to exists. There is no tracking and no account.
- Is my Wi-Fi password or contact data uploaded?
- No. The code is generated in your browser and the sensitive types are deliberately kept out of the page link – only URL and text content is placed in the address bar so you can share a link to the same code.
- PNG or SVG – which should I download?
- SVG for print and design work: it scales without blur and can be recoloured in any vector editor. PNG for documents, websites and messaging; pick 1024 px or more if it will be printed larger than a few centimetres.
- Why does my scanner not read a coloured code?
- Scanners need dark modules on a light background with strong contrast. Light-on-dark (inverted) codes and pastel colours below about 4:1 contrast fail on many phones; the tool flags both.