An open API service indexing awesome lists of open source software.

https://github.com/nuung/qrcode-gen

2025.06) QR Code Generator - Create high-quality, customizable QR codes with logos and UTM tracking for professional marketing campaigns
https://github.com/nuung/qrcode-gen

css3 html5 javascript marketing qrcode qrcode-generator

Last synced: 11 months ago
JSON representation

2025.06) QR Code Generator - Create high-quality, customizable QR codes with logos and UTM tracking for professional marketing campaigns

Awesome Lists containing this project

README

          

[![License](https://img.shields.io/badge/License-MIT-blue.svg)](LICENSE)
[![HTML5](https://img.shields.io/badge/HTML5-E34F26?logo=html5&logoColor=white)](https://developer.mozilla.org/en-US/docs/Web/HTML)
[![CSS3](https://img.shields.io/badge/CSS3-1572B6?logo=css3&logoColor=white)](https://developer.mozilla.org/en-US/docs/Web/CSS)
[![JavaScript](https://img.shields.io/badge/JavaScript-F7DF1E?logo=javascript&logoColor=black)](https://developer.mozilla.org/en-US/docs/Web/JavaScript)

# Super Easy QR Code Generator

> ***Create branded QR codes with UTM tracking in seconds***

[![Live Demo](https://img.shields.io/badge/Demo-Live-brightgreen)](https://nuung.github.io/qrcode-gen/)


QR Code Generator Preview

## Live Demo

> 👉 **[Try it now](https://nuung.github.io/qrcode-gen/)**
> Generate professional QR codes with logos and complete UTM parameter tracking for your marketing campaigns.

## Key Features

### 1) Super Simple Design

- Custom logos with smart positioning and sizing
- Brand colors with real-time color picker
- High-resolution output (1200x1200px) for print quality
- Modern UI with glassmorphism effects

### 2) Complete UTM Tracking

- Supports all 5 UTM parameters (source, medium, campaign, content, term)
- Presets for Facebook, Email, Print, YouTube campaigns
- Real-time URL preview
- Google Analytics ready

### 3) Advanced Customization

- Pattern enhancements for optimal scanner recognition
- Adjustable cell size & margins
- Optimized timing patterns for mobile scanning
- Export as SVG or PNG

### 4) Production Ready

- 100% client-side: no server, no data leakage
- Mobile-friendly and responsive
- Accessibility compliant (WCAG 2.1)
- Cross-browser compatible

## Ideal For

- Digital marketers
- Print designers
- Event organizers
- Content creators
- Small businesses
- ***And Every Builders!***

## Quick Start

1. Visit [nuung.github.io/qrcode-gen](https://nuung.github.io/qrcode-gen/)
2. Enter your URL and UTM parameters
3. Upload your logo (optional)
4. Customize colors and sizing
5. Download your QR code

## Use Cases

### 1) Marketing Campaigns

- Print ads with trackable QR codes
- Social media attribution
- Email performance tracking
- Event sign-up systems

### 2) Business Applications

- Digital business cards
- Branded product packaging
- Menu digitization
- Creative portfolio links

## Technical Highlights

- Built with Vanilla JavaScript – lightweight and fast
- Error Correction Level L for dense data
- Mobile-optimized scanning patterns
- Entirely client-side processing
- PWA ready – installable on desktop and mobile

## Why Use This Tool?

Compared to basic QR generators:

- ✅ Full UTM support for tracking marketing performance
- ✅ Logo branding with smart positioning
- ✅ Print-ready resolution
- ✅ Instant real-time preview
- ✅ All data handled locally for privacy
- ✅ Seamless mobile and desktop experience

## Links

- 🔗 **Tool**: [nuung.github.io/qrcode-gen](https://nuung.github.io/qrcode-gen/)
- 💻 **Code**: [github.com/nuung/qrcode-gen](https://github.com/nuung/qrcode-gen)
- 🛠️ **Feedback**: [GitHub Issues](https://github.com/nuung/qrcode-gen/issues)

## License

MIT License – free for personal and commercial use.

---

**Built by [Nuung](https://medium.com/@nuung) — Made for marketers and creators**