QR Code Generator and Reader

📖 What this does

You need a link on a poster, a phone number as a scannable card, or you have a screenshot with a code in it and want to know where it points. On a phone you would just scan it; on a desktop you need something that both writes and reads. This page does both halves. The top half encodes: type text, a URL or a phone number, pick the error correction level, the edge length and the two colours, and the code is drawn on the right as you type, ready to save as PNG or SVG or to copy straight onto the clipboard. The bottom half decodes: drop an image in and the page works through it pixel by pixel in your browser to recover whatever text or link was hiding in there.

✨ Features

• Content can mix Chinese, English, digits and punctuation. Everything is packed as UTF-8, so Chinese text does not come out as the mojibake you get from older encoders.
• Four correction levels: L around 7%, M around 15%, Q around 25%, H around 30%. Higher means the code still reads when part of it is covered or printed badly, at the cost of a denser pattern and a larger version for the same content.
• Edge length and quiet zone are controlled separately. The image is drawn at a whole number of pixels per module rather than being stretched to an arbitrary size, so nothing goes soft when you scale it up.
• Foreground and background colours are both yours to set, and a light code on a dark card will still scan. Weak combinations such as pale grey on white will encode fine and then fail on plenty of readers - the page will not stop you, so scan it yourself before you commit.
• Two export formats. PNG is what you want for documents and chat windows; SVG is vector output that stays clean when a layout program blows it up to poster size.
• Reading happens locally in the browser. Drag a file or pick one, and the recovered text can be copied out; when the payload turns out to be a link, an extra button opens it.

🛠 How to use it

1. Open the Generate tab and type into the box on the left. Give URLs their full https:// prefix, otherwise a scanner treats the result as plain text rather than a link.
2. Pick a correction level under output settings. Short content that you want to keep visually simple does fine at L or M; if the code will be printed somewhere it can get scuffed, or you plan to drop a logo in the middle of it, go with Q or H.
3. Drag the edge length and quiet zone sliders and set the two colours; the preview redraws as you go, and the Generate QR code button rebuilds it by hand, with a line under the button reporting whether it worked.
4. Press Download PNG or Download SVG to save a file, or Copy image when you want to paste it straight into a document.
5. To read a code, switch to the Read a code tab and drop the screenshot onto the dashed box on the left. The recovered text appears in the Result panel to the right, where an Open link button handles URLs and a copy button handles plain text.

⚠️ Before you rely on it

• Longer content means a denser code. Go past the capacity and you get a straight refusal rather than a silently truncated message - shorten the text or lower the correction level.
• Scannability is about contrast. A pale code on a pale background, or a foreground colour too close to the background, encodes perfectly and then fails on real scanners. For anything that matters, use black on white.
• Reading needs a reasonably clean image. Blur, glare and heavy perspective defeat it regularly. Crop away everything but the code first and your odds improve a lot.
• One code per image. When a picture holds several codes you get the first one found; crop the others out and run them separately.
• Nothing leaves the browser. Both encoding and decoding run locally. No image and no text is uploaded, and closing the tab discards everything.