xtract.bot

QR Code Generator — Documentation

This guide covers everything the QR Code Generator can do — from a plain link to branded codes with your logo, printable sticker sheets, and bulk generation. Everything runs in your browser; the codes you create are never uploaded anywhere.

Overview

A QR code encodes a short piece of text — most often a URL — as a grid of black-and-white modules a phone camera can read. This tool builds that grid and lets you style it, lay it out for print, and (optionally) make it editable after the fact.

The interface has three areas: a content card (what the code says), a style card (how it looks), and a preview & export panel on the right. A live preview re-renders as you type.

Choosing a content type

Pick the tab that matches what you want to happen when the code is scanned. The fields change to suit, and the correctly-formatted payload is built for you.

  • URL — open a web page. The most common choice.
  • Text — show arbitrary text on the scanner.
  • Wi-Fi — phones offer to join the network. Set SSID, password and security (WPA/WEP/open).
  • Contact (vCard) — add a contact card to the address book (name, phone, email, organisation, website, address).
  • Email / SMS / Phone — start a pre-filled email, text message, or phone call.
  • Location — drop a map pin at a latitude/longitude.
  • Calendar — add an event (title, location, start/end).
  • Crypto / Payment — a BIP-21-style payment request (Bitcoin, Ethereum, etc.) with optional amount.

Fields show advisory warnings (e.g. “doesn’t look like a URL”) but never block you — the code always encodes exactly what you enter.

Single vs batch

Use the Single / Batch tabs above the fields to switch modes.

Single

One code from one set of fields — the default.

Batch

Generate many codes at once. Set a quantity and fill a table where each row is one code. You can type directly into cells, or click the row icon to open a focused dialog for that record. Import a CSV/TXT file and its columns map onto the fields in order. Export the whole set as a ZIP of PNG or SVG files, or lay them out on a printable PDF (see below). If you enter fewer codes than fit on a page, only the codes you entered are produced.

Styling

Style controls update the preview instantly. None of them affect scannability data — they’re purely visual on top of the same code.

  • Foreground / background / eye colour — keep strong contrast (dark modules on a light background scans best).
  • Module shape — square, rounded, or dots.
  • Eye shape — the three corner finder patterns (square, rounded, circle), independently coloured.
  • Gradient — linear or radial fill across the modules.
  • Quiet zone — the blank margin around the code. Keep at least 4 modules for reliable scanning.
  • Transparent background — omit the background so the code sits on whatever you place it over. The preview shows a checkerboard to indicate transparency; exports are genuinely transparent.
  • Presets — one-click themes you can then tweak.

Call-to-action frame

Tick Call-to-action frame to wrap the code in a coloured border with a label band. The label defaults to “SCAN ME” but is fully editable — use “SCAN TO PAY”, “MENU”, “WIFI”, or anything that tells people what the code does. A clear instruction noticeably increases scan rates on printed material.

Error correction

Error correction adds redundancy so a code still reads when partly dirty, damaged, or covered. Higher levels make the code denser.

  • L (7%) — clean digital use, maximum data capacity.
  • M (15%) — sensible default for most cases.
  • Q (25%) — print, or small logos.
  • H (30%) — logos, harsh environments, small sizes.

Exporting & copying

Set the export resolution with the slider, then choose a format:

  • SVG — infinitely scalable vector; best for design tools and large print.
  • PNG / JPG / WebP — raster images at your chosen pixel size. PNG keeps transparency.
  • PDF — a single-code PDF (vector for plain codes, embedded raster when a logo/gradient is used).
  • EPS — for professional print workflows (square modules, flat colours).

Copy image / Copy SVG put the code straight on your clipboard for pasting into another app.

Verifying scannability

Heavy styling, a large logo, low contrast, or a small print size can stop a code reading. Click Verify scannable to decode your own rendered code and confirm it resolves to the right value before you commit to printing. If it fails, reduce the logo size, raise error correction, or increase contrast.

Best practices

  • Keep high contrast — dark modules, light background.
  • Preserve the quiet-zone margin; don’t crop tight.
  • For print, aim for at least 2–3 cm and test at final size.
  • Add a logo? Use error correction H and verify.
  • Add a “scan me” style label to tell people what it does.
  • Always test-scan with a real phone before mass printing.

Privacy

Codes are generated, styled, and verified entirely in your browser. Text you enter, logos you add, and the images you export are never sent to any server — there is no account, and nothing is uploaded or stored.