Colored QR code
generator
Create QR codes in any color — your exact brand hex, gradients, multi-tone designs. Live WCAG contrast validation ensures every colored QR code you download actually scans.
Any hex color · Gradient support · Live contrast check · Free
12 scan-safe color combinations
Every combination below has been validated with 5:1+ contrast. Use them as-is or tweak to your exact brand colors.
4 gradient fill types
Gradient QR codes create a premium, modern look. QR Maker validates contrast at every gradient point automatically.
Linear horizontal
Color sweeps left to right across all modules
Linear vertical
Color sweeps top to bottom for a sunset effect
Linear diagonal
Diagonal sweep creates dynamic depth
Radial
Color radiates outward from the center
Color rules that keep QR codes scannable
Dark modules on light background
Camera sensors need to detect dark modules against a light background. Inverted QR codes (light on dark) have lower scan reliability on many devices.
Minimum 3:1 contrast ratio
The contrast ratio between your foreground (module) color and background must be at least 3:1. QR Maker shows the live ratio and warns when it drops below safe levels.
Avoid red on green (and vice versa)
Red-green combinations are problematic for color-blind users and some QR decoder algorithms. QR Maker flags this combination automatically.
Gradients need minimum contrast at every point
With gradient fills, the contrast check runs at the lightest gradient point. If the lightest area still has 3:1+ contrast, the code is safe to use.
Colored QR code questions
Can a colored QR code be harder to scan than a black one?▾
Can I use my exact brand hex code?▾
Do gradients reduce scan reliability?▾
Can I have a transparent QR code?▾
What is the safest color combination for a colored QR code?▾
How to make a colored QR code that scans every time
The most common mistake people make with colored QR codes is choosing colors that look great on screen but fail to scan in the real world. Camera sensors read QR codes by detecting the contrast between dark modules and the lighter background — not by recognizing specific colors.
The 4.5:1 contrast rule
A contrast ratio of 4.5:1 between your module color and background gives you a comfortable margin across all lighting conditions — indoor fluorescent light, direct sunlight, and dim restaurant ambiance. At 3:1 (the minimum), the code will scan in ideal conditions but may fail outdoors or when the print quality is slightly off. QR Maker calculates this ratio live using the WCAG luminance formula.
Color combinations to avoid
- Red on green — poor for color-blind users and some decoders
- Yellow or lime on white — contrast often below 2:1
- Light gray on white — virtually invisible to some scanners
- Inverted (white modules on dark background) — unreliable on many iOS devices