QR code generator
Build a single-page QR code generator web app. The goal is to let anyone on the team quickly turn text or a URL into a downloadable QR code without touching a design tool or an external QR site. Trigger it with an HTTP route that serves the app as a webpage (e.g. /qr-code-generator), rendered in the browser. Restrict access to authenticated members of the tenant rather than leaving it open to the public. Build it as one React step that renders the whole UI client-side. The page should let a user: Enter the text or URL to encode. Generate the QR code live in the browser as they type. Choose an output format (PNG, JPEG, SVG — or whatever raster/vector set makes sense). Choose a size (e.g. small / medium / large presets). Download the result, and copy it to the clipboard. Do the QR generation entirely client-side with a QR library bundled into the React app (I used the qrcode npm package — swap in any equivalent QR-generation library you prefer). No backend calls, no external API, no data leaves the browser. Give it a polished, distinctive visual design worth sharing — commit to a clear aesthetic direction rather than a generic form-and-button layout. Tools used: React, qrcode (npm package)
What this prompt builds
A self-contained QR code generator that creates codes client-side from any text or URL, with no external service, expiration, or tracking. Users select a format (PNG, JPEG, or SVG) and an explicit pixel size, then preview, copy, or download the result instantly. Built for teams that need quick, predictable QR codes for marketing material, signage, packaging, or handouts without ads or paywalls.
The problem
Anyone who creates marketing material, signage, packaging, or handouts regularly needs QR codes for links, menus, event pages, or print collateral, but free online generators are cluttered with ads, lock useful sizes or formats behind paywalls, and sometimes quietly expire codes or track scans. Worse, vague labels like "large" force users to download, check dimensions, and try again, wasting time on something that should take seconds. This workflow solves that friction with a simple, self-contained QR code generator. Paste in text or a URL, pick a format (PNG, JPEG, or SVG) and a size with actual pixel dimensions displayed, then preview, copy, or download the result instantly—everything generated client-side with no third-party service, no expiration, and no guessing.
Solution and impact
The workflow eliminates the repetitive friction of generating QR codes by making the task quick and predictable. No ads, no sign-up, no paywalled formats, and no downloading three times to find the right size—designers get clean SVGs for print, everyone else gets ready-to-use PNGs or JPEGs, and the whole process takes seconds instead of minutes. Because QR generation happens entirely in the browser with no external service, content never leaves the workflow, codes never expire, and teams gain a reliable, repeatable tool for a task they face regularly.