QRLens

A gentle little Chrome extension that reads QR codes from any page. Slides in from the right edge — pick a region or sweep the whole viewport.

Manifest V3 · No build step · Vanilla JS · Runs entirely on-device

---

Features

• Region select — drag a box around any QR on the page
• Quick scan — sweep the whole visible viewport in one click
• Slide-in drawer — soft, chunky, mobile-first UI with light + dark mode
• History — the last 30 scans, tap to re-open
• Auto-copy — decoded text lands on your clipboard immediately
• Visual feedback — green pulse + toast on success, red pulse on miss
• Rebindable shortcuts — set whatever keys are free for you
• Local only — no network requests, no telemetry, no tracking

Install (Developer Mode)

1. Clone or download this repo

   git clone https://github.com/SnowiyQ/qrlens
   

2. Open chrome://extensions
3. Toggle Developer mode on (top-right)
4. Click Load unpacked and pick the qrlens folder
5. Pin the QRLens icon to your toolbar

Usage

• Click the QRLens toolbar icon → the drawer slides in from the right
• Pick Select a region and drag a box around the QR
  • Right-click anywhere to cancel
• Or pick Quick scan to read the whole viewport at once
• A green pulse means it worked — the text is already on your clipboard
• A red pulse means no QR was found in that area

Keyboard shortcuts

Action	Default
Select a region	Ctrl + Shift + Q
Quick scan	unbound
Toggle panel	unbound

Rebind in chrome://extensions/shortcuts (the Set shortcuts button in the About tab opens it).

Privacy

QRLens does not make any network requests. Everything happens locally:

• The visible tab is captured via chrome.tabs.captureVisibleTab
• Pixels are processed in an OffscreenCanvas
• Decoding runs in the service worker via jsQR
• History is stored only in chrome.storage.local

No analytics. No remote endpoints. No background pings.

Tech

• Manifest V3
• ES module service worker
• Content script + same-origin iframe for the drawer (CSS isolation)
• jsQR for decoding
• No bundler, no framework, no dependencies to install

Project layout

qrlens/
├── manifest.json
├── background.js     service worker — capture, decode, history
├── content.js        injects the drawer iframe, drives region select
├── content.css       region overlay + pulse/toast styles
├── panel.html        drawer UI
├── panel.css         drawer styles (light + dark)
├── panel.js          drawer logic
├── lib/jsQR.js       decoder (UMD + a single ESM export shim)
└── icons/            16/32/48/128 PNGs

Development

No install step. Edit files and hit the reload button on chrome://extensions.

If you tweak lib/jsQR.js, keep the trailing line:

export default self.jsQR;

The original UMD bundle attaches jsQR to self; the export turns it into an ES module the service worker can import.

Roadmap

• Decode from an arbitrary image file or URL
• Multi-QR detection
• Webcam scanning
• Optional sound on success
• Sync history across devices (opt-in)

License

MIT © SnowiyQ — see LICENSE

Credits

Decoder: jsQR by Cosmo Wolfe (Apache 2.0).