A lightweight Chrome extension that generates high‑quality QR codes (1000×1000 px) for the current page URL or any custom text. Copy the QR image to clipboard or download it as a PNG with a single click.
- High‑resolution QR codes – generates 1000×1000 px images, crisp and scalable.
- Brand text overlay – optionally add custom text (logo, slogan) centered over the QR code.
- Real‑time preview – see the QR code instantly as you type, with debounced updates.
- Two‑action output – copy the QR image to clipboard or download it as a PNG file.
- Auto‑fill current page URL – the pop‑up pre‑fills the active tab’s address.
- Clean, minimal UI – a compact pop‑up (320px) with intuitive buttons.
- No external requests – uses the pure‑JavaScript qrcode.js library, works entirely offline.
(Link will be added after publication)
- Download or clone this repository:
git clone https://github.com/Rostezkiy/qr-code-extension.git
- Open Chrome and navigate to
chrome://extensions/. - Enable Developer mode (toggle in the top‑right corner).
- Click Load unpacked and select the folder containing the extension files (
manifest.json,popup.html, etc.). - The extension icon will appear in your toolbar; pin it for quick access.
- Click the extension icon in the Chrome toolbar.
- The pop‑up opens with a textarea pre‑filled with the current page URL.
- You can edit the text or paste any other content (URL, plain text, contact info, etc.).
- The QR code updates automatically as you type.
- Use the buttons below the QR:
- Copy – copies the QR image to the clipboard (ready to paste into documents, chats, etc.).
- Download – saves the QR code as a PNG file named
qrcode.png.
qr‑chrome/
├── manifest.json # Extension manifest (Chrome API configuration)
├── popup.html # Pop‑up UI (HTML structure)
├── popup.js # Core logic: QR generation, copy/download handlers
├── style.css # Styling for the pop‑up (optional, currently inline)
└── qrcode.min.js # Minified QR‑code library (qrcode.js v1.0.0)
- manifest.json – defines the extension’s name, version, permissions (
activeTab), and pop‑up entry point. - popup.html – contains the textarea, QR container, buttons, and status message.
- popup.js – handles:
- Reading the current tab’s URL and populating the textarea.
- Instantiating the QR‑code library with a 1000‑pixel canvas.
- Binding the Copy button to copy the canvas image to clipboard.
- Binding the Download button to trigger a PNG download.
- qrcode.min.js – third‑party library (≈50 KB) that performs the actual QR encoding.
The extension requests only one permission:
activeTab– to read the URL of the currently active tab and pre‑fill the input field.
No data is sent to any external server; everything stays locally in your browser.
If you want to modify the extension:
- Edit
popup.htmlto change the layout or add new UI elements. - Adjust styles directly in the
<style>block insidepopup.html(or linkstyle.css). - Modify
popup.jsto alter the QR size, add new output formats, or integrate with other APIs. - Update
manifest.jsonif you change the extension’s name, version, or permissions. - Reload the extension on
chrome://extensions/after each change.
The project uses no build system; all files are plain HTML/JS. You can replace qrcode.min.js with a newer version from qrcodejs if needed.
Contributions are welcome! Feel free to open an issue or submit a pull request.
- Fork the repository.
- Create a feature branch (
git checkout -b feature/amazing‑feature). - Commit your changes (
git commit -m 'Add amazing feature'). - Push to the branch (
git push origin feature/amazing‑feature). - Open a Pull Request.
- qrcode.js – the JavaScript QR‑code library used under the MIT license.
- Chrome Extensions API documentation.
Enjoy generating QR codes effortlessly! 🎉
If you find this extension useful, consider giving it a star ⭐ on GitHub.