QR Code Styling
Restyle a QR code with rounded modules, a gradient fill, custom colours and a centre logo — and check it still scans.
QR & barcode Client-side qrcode modules + canvas-free rasteriser
Tool preview
How to use it
- 01
Enter the content.
- 02
Pick colours, toggle rounded modules and the gradient, and optionally drop a logo.
- 03
Download the PNG and scan it with your phone before printing.
Limitations
- ! Low contrast breaks scanning; keep the foreground much darker than the background.
- ! A centre logo forces high error correction and hides modules, so keep it small.
- ! Inverted codes (light on dark) are not readable by every scanner.
FAQ
Can I put my logo in the middle?
Yes. Drop a PNG with transparency, keep it around 20% of the width, and the tool switches to the highest error correction automatically.
Why did my coloured code stop scanning?
The contrast ratio dropped below what scanners need; darken the foreground or lighten the background.
Do the colours affect the data?
No, only the appearance. The encoded content is unchanged.
Files never leave your device
Processing happens in your browser using the File API, WebAssembly and Web Workers. There is no upload endpoint.
Technical details
- Processing
- Client-side
- Implementation
- qrcode modules + canvas-free rasteriser
- Category
- QR & barcode
- Network requests
- None while processing