Text / URL to QR Code

Turning any text into a scannable grid

This tool converts whatever you type — a URL, a phone number, a Wi-Fi string, a block of plain text — into a QR code rendered live on an HTML canvas. As soon as you type, it encodes the string, chooses the smallest grid that fits, and paints black and white modules you can download as a PNG. Behind the scenes it uses the well-known open-source qrcode JavaScript library (version 1.5.4), loaded once from a public CDN (jsDelivr). The library does all the encoding maths; your text is passed to it locally in the browser and is never sent to our servers. The only network request is the one-time fetch of the library file itself.

What the four controls actually change

Increasing the error-correction level packs in redundant data, which forces a denser grid for the same text. That is the trade-off behind the logo feature, explained below.

How the logo overlay works — and why it can fail

When you upload a logo, the tool does not weave it into the encoding. It generates the full QR code first, then draws a white circle in the dead center and paints your image on top at 20% of the canvas width. Those covered modules are simply lost. This only scans reliably because Reed–Solomon error correction can reconstruct the missing data — but only up to its limit. A 20% center patch is comfortably inside level Q (~25%) and H (~30%), but it can exceed level M (~15%) once you account for the quiet zone and finder patterns. That is exactly why the tool nudges you to switch to Q or H whenever you add a logo. If a logo'd code refuses to scan, raising the error-correction level is almost always the fix.

A worked example

Type WIFI:S:CafeGuest;T:WPA;P:latte2024;; into the box, leave the size at 300 px, and switch error correction to H. The library measures the 37-character string, selects a QR version large enough to hold it plus the heavy H-level redundancy, and renders the grid with your chosen colors and a 2-module margin. A guest scans it with their phone camera and joins the Wi-Fi network with no typing. Because the credentials are baked into the pattern, the code works offline and never expires — and because everything is generated on your device, the password never leaves your browser.

Practical tips

• Keep contrast high. The tool lets you pick any two colors, but light-on-dark and low-contrast pairs fail on many scanners. Keep the foreground clearly darker than the background, and avoid red-on-green or similar low-luminance combinations.
• Don't shrink the print too far. The 200–600 px size is the on-screen render; what matters in print is physical size versus scan distance. A rough rule is 10:1 — a code read from one metre away wants to be about 10 cm wide.
• Shorten long links first. A long URL forces a denser grid with tiny modules. If your link is long, run it through a redirect so the encoded string stays short and the modules stay chunky.
• Test the actual PNG. Download the file and scan it from the medium you'll publish on — a screenshot of the preview can differ from the exported image after printing or compression.

Common mistakes

The most frequent failure is a logo on a low error-correction setting — the code looks fine but scanners can't recover the hidden modules. The second is cropping away the white margin: the library adds a 2-module quiet zone for a reason, so don't trim right to the data. The third is inverting colors for style; test inverted codes on an older phone before committing to a print run, because not every scanner handles light-on-dark. Finally, remember this produces a static code: the destination is fixed once generated. If you need to change a URL later or track scans, you'd need a dynamic-QR service that adds a redirect — but that also means a third party logs every scan, whereas this tool keeps things private and free.