QR Craft | HTML5 Consumer-Facet QR Code Generator – Internet App
Model: 1.0 | CodeCanyon Prepared
Technical Necessities
| Browser | Model | Standing |
|---|---|---|
| Google Chrome | 60+ | ✅ Full Help |
| Mozilla Firefox | 55+ | ✅ Full Help |
| Apple Safari | 12+ | ✅ Full Help |
| Microsoft Edge | 79+ | ✅ Full Help |
| Opera | 50+ | ✅ Full Help |
| iOS Safari | 12+ | ✅ Full Help |
| Android Chrome | 60+ | ✅ Full Help |
Any trendy net browser – no further plugins, server, or web connection required after preliminary load.
Desk of Contents
- 1. Challenge Overview
- 2. Key Options
- 3. QR Sorts Supported (16+)
- 4. Set up
- 5. File Construction
- 6. The best way to Use
- 7. Customization Information
- 8. API Reference
- 9. Browser Help
- 10. FAQ
- 11. CodeCanyon Submission Information
- 12. Help & Updates
1. Challenge Overview
QR Craft Grasp is a premium, absolutely client-side HTML5 QR code era and scanning utility that runs solely within the browser. No server, no database, no API keys, no web connection required after preliminary load. Merely open the HTML file and begin producing skilled QR codes immediately.
Key Highlights:
- ✅ 100% Consumer-Facet – All processing occurs regionally
- ✅ No Server Required – Works offline fully
- ✅ No API Keys – No registration or limits
- ✅ Privateness Centered – Zero monitoring, zero analytics
- ✅ 16+ QR Sorts – Textual content, URL, WiFi, vCard, Crypto, Occasions & extra
- ✅ Constructed-in Scanner – Add and decode any QR code
- ✅ Actual-time Preview – See modifications as you kind
- ✅ Customized Styling – Colours, sizes, error correction ranges
- ✅ Export Choices – Obtain PNG or copy to clipboard
- ✅ Responsive Design – Works on all units
✨ 2. Key Options
QR Code Era
- 16+ Knowledge Sorts – Textual content, URL, Cellphone, SMS, E-mail, WhatsApp, FaceTime, Location, WiFi, Occasion, vCard, Crypto, PayPal, UPI, EPC, Scanner
- Actual-time Dwell Preview – On the spot QR replace on each keystroke
- Customized Colours – Foreground and background shade pickers
- Adjustable Dimension – From 128px to 512px
- Error Correction – L (7%), M (15%), Q (25%), H (30%) ranges
QR Scanner
- Add any picture containing a QR code
- On the spot decoding and end result show
- Copy scanned outcomes to clipboard
- Open URLs instantly from scan outcomes
Export Choices
- Obtain as PNG – Excessive-quality picture obtain
- Copy to Clipboard – Copy QR picture instantly
- Print Prepared – Good for enterprise playing cards, flyers
⚡ Efficiency
- Zero exterior dependencies
- Light-weight (~150KB whole)
- Quick era velocity
- Cellular optimized
3. QR Sorts Supported (16+)
| Sort | Description | Format Instance |
|---|---|---|
| Textual content | Plain textual content messages and notes | Hi there World! |
| URL | Web site hyperlinks and net addresses | https://example.com |
| Cellphone | Click on-to-call cellphone numbers | tel:+1234567890 |
| SMS | Pre-filled textual content messages | sms:+1234567890?physique=Hi there |
| E-mail with topic and physique | mailto:[email protected] | |
| Direct WhatsApp chat hyperlinks | https://wa.me/1234567890 | |
| FaceTime | Video name hyperlinks | facetime:[email protected] |
| Location | GPS coordinates | geo:40.7128,-74.0060 |
| WiFi | Community credentials | WIFI:S:SSID;T:WPA;P:move;; |
| Occasion | Calendar occasions (iCal) | BEGIN:VEVENT… |
| vCard | Digital enterprise playing cards | BEGIN:VCARD… |
| ₿ Crypto | Bitcoin/Ethereum funds | bitcoin:tackle?quantity=0.01 |
| PayPal | Fee hyperlinks with quantity | https://paypal.me/username |
| UPI | Indian unified funds | upi://pay?pa=person@financial institution |
| EPC | European financial institution transfers | BCDn002n1nSCT… |
| Scanner | Add and decode QR codes | – |
4. Set up
Methodology 1: Direct Add (Really useful)
- Obtain the package deal
- Extract information to your net server
- Open
index.htmlin browser - Carried out! No configuration wanted.
Methodology 2: Native Use
- Obtain and extract information
- Double-click
index.html - Works instantly in your browser
Methodology 3: Customized Integration
<!-- Embrace information --> <hyperlink rel="stylesheet" href="types.css"> <div id="qrcode"></div> <script src="script.js"></script>
5. File Construction
qr-craft-master/ ├── index.html # Essential utility file ├── types.css # Full styling (responsive) ├── script.js # Full JavaScript (QR library + app logic)
Whole Dimension: ~150 KB (compressed)
6. The best way to Use
Step 1: Choose QR Sort
Click on on any QR kind button from the grid (Textual content, URL, WiFi, vCard, and so forth.)
Step 2: Enter Data
Fill within the kind fields that seem based mostly in your chosen QR kind
Step 3: Customise Styling (Non-compulsory)
- Change foreground/background colours utilizing shade pickers
- Modify dimension utilizing the vary slider (128px – 512px)
- Choose error correction degree for sturdiness
Step 4: Generate & Export
- QR code generates robotically in real-time
- Click on Obtain PNG to save lots of as picture
- Click on Copy Picture to repeat to clipboard
Step 5: Scan QR Codes (Scanner Mode)
- Choose “QR Scanner” from the categories grid
- Click on “Add QR Picture” button
- Choose a picture containing a QR code
- View decoded end result and duplicate/open if wanted
7. Customization Information
Change Default Colours
// In index.html - modify default values <enter kind="shade" id="fgColor" worth="#000000"> <enter kind="shade" id="bgColor" worth="#ffffff">
Change Dimension Vary
// In index.html - modify min/max attributes <enter kind="vary" id="qrSize" min="128" max="512" worth="256">
Change Branding/Header
// In index.html - edit header part
<div class="header">
<h1>Your Model Title Right here</h1>
<p>Your tagline right here</p>
</div>
Modify Colours in CSS
/* In types.css - change gradient colours */ background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); /* Change major button shade */ background: linear-gradient(135deg, #4c63d2 0%, #6366f1 100%);
Add New QR Sort
// In script.js - add to QR varieties array // 1. Add button in index.html // 2. Add kind template in updateFormContent() // 3. Add information era in generateQRData()
8. API Reference
World Object: qrApp (obtainable in console)
Core Strategies
| Methodology | Description | Utilization |
|---|---|---|
generateQR() |
Generate QR code with present settings | qrApp.generateQR() |
switchType(kind) |
Swap between QR varieties | qrApp.switchType(‘wifi’) |
downloadQR() |
Obtain QR as PNG | qrApp.downloadQR() |
copyQR() |
Copy QR to clipboard | qrApp.copyQR() |
scanUploadedQR(file) |
Scan uploaded QR picture | qrApp.scanUploadedQR(fileObject) |
Configuration Choices
// Default configuration
{
dimension: 256, // QR dimension in pixels
fgColor: '#000000', // Foreground shade
bgColor: '#ffffff', // Background shade
errorLevel: 'H' // L, M, Q, H
}
9. Browser Help
| Browser | Model | Standing |
|---|---|---|
| Google Chrome | 60+ | ✅ Full Help |
| Mozilla Firefox | 55+ | ✅ Full Help |
| Apple Safari | 12+ | ✅ Full Help |
| Microsoft Edge | 79+ | ✅ Full Help |
| Opera | 50+ | ✅ Full Help |
| iOS Safari | 12+ | ✅ Full Help |
| Android Chrome | 60+ | ✅ Full Help |
❓ 10. Ceaselessly Requested Questions
Q1: Does this require an web connection?
No! After preliminary load, QR Craft Grasp works fully offline.
Q2: Is there any information assortment or monitoring?
Completely none. Zero analytics, zero exterior calls, zero monitoring.
Q3: Can I add a brand to the QR code?
Sure, with error correction degree H (30%) you may overlay logos manually.
This fall: What number of QR codes can I generate?
Limitless. No restrictions, no API limits.
Q5: Can I take advantage of this on my web site?
Sure, you may combine it into any web site or net utility.
Q6: Does it work on cell phones?
Sure, absolutely responsive and touch-optimized for all cell units.
Q7: Can I customise the design?
Sure, full CSS is offered and well-commented for simple customization.
Q8: Is assist included?
Sure, 6 months of free assist included with buy.
Package deal Contents for Submission
qr-craft-master/ ├── index.html ├── types.css ├── script.js ├── qr.min.js
12. Help & Updates
Help Included:
- ✅ 6 months free assist from buy date
- ✅ Lifetime updates for model 1.x
- ✅ E-mail assist inside 24-48 hours
- ✅ Bug fixes and safety updates
Prolonged Help (Non-compulsory):
- 12 months assist extension obtainable
- Customization providers obtainable (paid)
- Precedence electronic mail assist
Conclusion
QR Craft Grasp is the whole answer for anybody needing an expert, dependable, and feature-rich QR code generator. With its client-side structure, 16+ QR kind assist, built-in scanner, and premium design, it provides distinctive worth for builders, companies, and people.
Use Instances: Internet builders, digital businesses, print outlets, occasion organizers, advertising professionals, small companies, and anybody who must create QR codes professionally.
QR Craft Grasp | HTML5 Consumer-Facet QR Code Generator – Internet App
Create, Customise, Scan. All in One Place.

