How to choose QR code colors that still scan
Choose QR code colors with enough contrast, keep a clear border, and test the code on phones before you print or share it for reliable scanning.
You want a QR code that fits your design, but a code that looks good and will not scan is no use to anyone. The safest approach is to keep the pattern dark, the background light, and test the finished code with a phone before you share or print it.
You can set the colors in the QR Code Generator. These guidelines help you choose a color combination that looks intentional without making the squares hard for a camera to read.
Choose and test your QR code colors
- Open the QR Code Generator and enter the content for your code, such as a website link or Wi-Fi details.
- Choose a dark color for the QR pattern and a light color for the background. Black on white is the most dependable starting point. Navy or dark green on white or a very pale background can also work.
- Keep the colors solid and make sure the small squares are easy to distinguish from the background. Avoid pale pattern colors, dark backgrounds, and combinations that look similar in brightness.
- Generate the code and scan it with your phone's camera or QR scanner. Try it from the distance people are likely to use, and test more than one phone if the code matters.
- Check the final image or print, not just the preview. Keep the clear border around the code, and scan again after changing its size or placing it in a design.
Which color combinations work best?
Dark pattern on a light background
This is the safest choice because the camera can clearly separate the pattern from the background. Black on white has the most predictable result. If you want a brand color, try a deep shade such as navy or dark green on white, cream, or another very pale color.
Light pattern on a dark background
An inverted code may scan on some phones, but not every camera or scanning app handles it reliably. If you use a light pattern on a dark background, test it on several devices before printing or publishing it. For something customers or guests must scan, the conventional dark-on-light arrangement is a better bet.
Pastel or similar-brightness colors
A bright hue is not automatically a readable QR color. A pale blue pattern on a pale yellow background can be hard to separate, even though the colors look different. Choose colors that also differ strongly in brightness, not just in hue. When in doubt, make the pattern darker or the background lighter.
The code scans on a screen but not on paper
The printed version may be too small, low contrast, blurry, or affected by glare. Printers can also reproduce colors differently from a screen. Scan the actual print in ordinary lighting. If it fails, print it larger and use a darker pattern with a lighter background.
How to fix a QR code that will not scan
- Switch to a dark pattern on white. This quickly rules out a color combination that is confusing the camera. Try black and white before making smaller design changes.
- Restore the clear border. QR codes need an empty margin around the pattern, called a quiet zone. Keep at least four small square widths of blank space around the outside, and do not crop it or place text right against it.
- Make the code larger. A code that looks crisp on a large monitor may be too small on a label or flyer. Increase its printed size and scan it from the distance people will actually stand.
- Remove overlays and decoration. A logo, illustration, or text can cover squares the scanner needs. Test a plain version first. If you want a logo, follow the guidance in how to add a logo to a QR code without breaking it.
- Check the file and surface. Use a sharp image rather than a screenshot of a screenshot. On glossy paper or a bright screen, move the phone to reduce reflections and try again.
- Regenerate the code if needed. If it still fails, enter the original content again and create a fresh code. Then scan the new version before replacing the one in your design.
Leave room around the code
The quiet zone is the plain area that separates a QR code from nearby text, borders, and images. Its width is measured in modules, which are the little squares that make up the pattern. A margin of at least four modules is a common baseline. Keep it clear on all four sides, including when you put the code inside a colored card or add it to a poster.
Color and size work together. A strong color contrast cannot rescue a code that is tiny, blurred, or partly covered. Make a test print at the intended size, scan it using a normal phone camera, and only then print or share the full batch.
