Beam - QR Generator

Live Demo ↗

Create QR codes from the current webpage or custom content through one clean browser extension.

Beam is a React and TypeScript QR generator featuring live previews, multiple output sizes, adjustable error correction, image copying, and PNG downloads. It provides a complete source-code foundation for browser utilities, sharing tools, productivity products, and client extension projects.

Perfect For

✓ Web Developers

✓ Digital Marketers

✓ Content Creators

✓ Business Owners

✓ Event Organisers

✓ eCommerce Businesses

✓ Productivity Applications

✓ Browser Utility Products

✓ Startup Products

✓ Agency Client Projects

Why Choose Beam?

✓ Generate QR codes from the current tab

✓ Generate QR codes from custom text or URLs

✓ Instant live QR preview

✓ Multiple output sizes

✓ Adjustable error-correction levels

✓ Copy generated QR codes as images

✓ Download QR codes as PNG files

✓ Local browser processing

✓ No external QR-generation service

✓ Minimal browser permissions

✓ Clean and organised source code

✓ Easy to customise and extend

✓ No recurring subscription fees

What’s Included

Your download includes:

📦 Complete React & TypeScript Source Code

📦 Chrome Manifest V3 Production Build

📦 Microsoft Edge-Compatible Build

📦 QR Generator Popup Interface

📦 Current Tab URL Detection

📦 Custom Text & URL Input

📦 Live QR Preview

📦 QR Size Controls

📦 Error-Correction Controls

📦 Copy Image Action

📦 PNG Download Action

📦 Automatic Filename Generation

📦 Local QR Rendering

📦 Background Service Worker

📦 Extension Icons & Assets

📦 WXT Configuration

📦 TypeScript Configuration

📦 Package Configuration

📄 Documentation (README.md)

Key Features

✓ Current Tab QR Generation

✓ Custom Text QR Generation

✓ Custom URL QR Generation

✓ Automatic Tab URL Detection

✓ Live QR Code Preview

✓ 192 × 192 Output

✓ 256 × 256 Output

✓ 384 × 384 Output

✓ 512 × 512 Output

✓ Low Error Correction

✓ Medium Error Correction

✓ Quartile Error Correction

✓ High Error Correction

✓ Copy QR Code as an Image

✓ Download QR Code as PNG

✓ Timestamp-Based Download Filenames

✓ Empty Input Handling

✓ QR Generation Error Display

✓ Local Browser Processing

✓ Minimal Manifest V3 Permission

Technology Stack

Built using modern browser-extension technologies:

✓ React 19

✓ TypeScript

✓ WXT

✓ Manifest V3

✓ QRCode Library

✓ Browser Tabs API

✓ Clipboard API

✓ ClipboardItem API

✓ Data URL Generation

✓ Blob API

✓ Component-Based Architecture

✓ Modern CSS

✓ Modern Folder Structure

Performance Features

Designed for fast QR-generation workflows:

✓ Instant Client-Side Generation

✓ No External API Requests

✓ No Remote Processing Server

✓ Lightweight Popup Interface

✓ Automatic Live Preview

✓ Local Image Rendering

✓ Fast Data URL Creation

✓ Multiple Output Resolutions

✓ Minimal Browser Permissions

✓ Reusable React Components

✓ Clean TypeScript Implementation

✓ Modern Manifest V3 Architecture

✓ Easy Branding Customisation

✓ Scalable Source-Code Structure

How It Works

1. Download and extract the project files.
2. Install the project dependencies.
3. Run the development environment or generate a production build.
4. Load the generated extension folder into your browser.
5. Open Beam from the browser toolbar.
6. Choose the current tab or custom-content mode.
7. Enter the text or URL you want to encode.
8. Select the preferred QR-code size and error-correction level.
9. Preview the generated QR code instantly.
10. Copy the QR code as an image or download it as a PNG file.
11. Customise the branding, colours, sizes, icons, and functionality.
12. Build and publish the completed extension when ready.

Browser Compatibility

Works with:

✓ Google Chrome

✓ Microsoft Edge

✓ Brave

✓ Opera

Compatibility with other Chromium-based browsers may be possible but should be tested before production use.

License

Your purchase includes:

✓ Lifetime access to the purchased source code

✓ Commercial use for personal and client projects

✓ Full customisation rights

✓ Unlimited personal and client projects

You may not:

✗ Resell the original source code

✗ Redistribute the files

✗ Share the files publicly

✗ Repackage the source code as a competing digital product for resale

Instant Digital Download

No physical product will be shipped.

Immediately after purchase, you’ll receive instant access to download the complete QR-generator source code, production build, and documentation so you can begin creating your own browser QR tool.

Important Note

Beam generates standard QR codes locally inside the browser.

The image-copy feature depends on browser and operating-system support for the Clipboard Image API. Users can download the QR code as a PNG when direct image copying is unavailable.

Very long text may create dense QR codes that are harder for some devices to scan. Customers should test generated codes before using them in printed materials, packaging, advertisements, or production campaigns.

Beam does not include:

✗ Dynamic QR-Code Redirection

✗ Scan Analytics

✗ Cloud Storage

✗ User Accounts

✗ Hosted Short Links

✗ SVG or PDF Export

✗ Browser Marketplace Publication

PROJETO STACK - Premium software templates and digital products built for modern businesses.