QR Code Generator

Overview

This QR Code Generator is a web application that lets users create downloadable QR codes from text or URLs. Built with Flask for the backend and a simple HTML/CSS/JavaScript frontend, it offers customization options like size, background color, and file format (PNG, SVG). With a dark mode toggle and responsive design, it’s both user-friendly and versatile across devices.

Data Sources

• User Input: Text or URLs entered via the frontend form
• QRCode Library: Python library generates QR codes dynamically

Technologies Used

• Backend: Python, Flask (routing, QR generation), QRCode library (image creation)
• Frontend: HTML (structure), CSS (styling, dark mode), JavaScript (interactivity)

Key Features

• Generate QR codes from any text or URL input
• Customize QR code size (e.g., small, medium, large) and background color
• Choose between PNG or SVG file formats for download
• Toggle between light and dark modes for better usability
• Reset form to clear inputs and previews
• Responsive layout for desktop and mobile

Backend Process

• Routing: Flask handles / (index), /generate (POST), /download (file serving)
• QR Generation: qrcode.QRCode creates images with version=1, ERROR_CORRECT_L, custom size, and colors
• File Handling: Saves QR codes to static/qr_codes/ as PNG or SVG, serves via send_file
• API: JSON responses deliver QR code URLs to the frontend

Performance

• Speed: Generates QR codes in <1s with Flask’s lightweight server
• Reliability: Basic error handling for empty inputs (returns 400)
• Scalability: File-based storage works for small scale; needs cloud integration for growth

Challenges Overcome

• Integrated Flask backend with dynamic frontend updates via JSON
• Managed file format conversion (PNG/SVG) with the QRCode library
• Implemented dark mode toggle with CSS/JavaScript for seamless UX

Benefits

• Convenience: Quick QR code creation and download
• Customization: Tailored size and color options
• Accessibility: Works on any device with a browser

Future Improvements

• Add file upload support with cloud storage (e.g., AWS S3)
• Enable foreground color customization for QR codes
• Expand file format options (e.g., JPG, PDF)

Demo

Try It

Clone the repo, install dependencies, and run app.py! See GitHub for setup.