Advanced & CustomStatic QR code

Custom Colour QR Code Generator

A custom colour QR code lets the symbol match a brand, poster or product label. Pick a dark foreground and a light background, and the contrast indicator below the colour controls will warn you when the combination becomes risky.

QR scanners rely on the difference between dark and light modules. Pretty colour combinations can still be unreadable, so test the exact printed colours with a phone instead of judging them on a backlit screen.

What this QR code stores: The QR code stores the text or URL you enter. Colours, size and error correction affect the appearance and resilience of the pattern, but they are not data fields in the scanned content.

Text and URLs are encoded exactly as entered. URLs open when scanned if the content is a complete address.

Style and output

PNG pixel size. SVG scales without losing quality.

Higher levels survive damage but create a denser pattern.

Available in PNG and SVG. Place the code on a light, plain surface.

Contrast is 10.5:1 — good for scanning.

Centre logo (optional)

PNG, JPEG or WebP · max 1.5 MB

A logo covers data modules. Keep it small, use a high-contrast image and always test the finished code.

Your image is processed in this browser only. Nothing is uploaded. Maximum file size: 1500 KB.

Your content is encoded in this browser. Nothing you type or upload is sent to a server.

QR code preview

Static QR code

No code generated yet

Fill in the fields, then generate your QR code.

Contrast is 10.5:1 — good for scanning.

Download

PNG and SVG files are created in your browser. The selected logo, if any, is included in the file.

Test first: scan the finished code with at least one phone camera before you print, laminate or publish it.

Before you print or share

  • Dark modules on a light background are the safest arrangement. Inverted codes (light modules on dark) fail on many scanners.
  • Avoid placing the code on a busy photo or a low-contrast surface. The downloaded PNG or SVG includes only the code and its quiet zone.

Practical guidance for this generator

Example: Enter a short URL, set the foreground to #0B3D6B and the background to #FFF8E7, check the contrast warning, then print a proof on the actual card stock.

Common mistakes

  • Choosing a mid-tone brand colour that looks fine on screen and fails in print.
  • Inverting the code to light modules on a dark background.
  • Placing a transparent code over a photo with no white pad.

Testing checklist

  • Read the contrast ratio and stay above 4.5:1 where possible.
  • Scan the on-screen preview with two phones.
  • Print a physical proof under the lighting where it will be used.

When to choose a different tool

Use a URL QR code instead if the message is long, may change, or needs to be updated without reprinting.

How to create this QR code

  1. Enter the content you want to encode.

  2. Choose foreground and background colours and check the contrast message.

  3. Generate, scan the on-screen code, then test a printed proof before a full run.

More on this QR code

Resolution and print quality

Print work needs more pixels than a phone screen. The PNG export reaches 2048 × 2048 pixels, which is enough for most labels and posters when the code occupies a modest part of the artwork. For large signage, use the SVG and let the printer rasterise it at the output resolution.

Resolution is only one part of print quality. Physical size, contrast and the quiet zone matter just as much. A huge PNG printed at 1 cm will still be hard to scan, and a low-contrast code will fail at any resolution.

  • Use SVG for professional print and PNG for screens.
  • Keep at least four modules of clear white margin.
  • Do not upscale a small PNG; regenerate at a larger size.
  • Ask the printer to preserve the quiet zone.

Choosing brand colours that still scan

The safest brand adaptation is a dark brand colour for the modules and white, off-white or a very pale tint for the background. Mid-tone colours such as orange, teal or pink often look fine on screen and fail on a matte print under warm indoor light.

If the brand palette only offers mid-tones, keep the QR code in black and place the brand colour in the surrounding design instead. A code that scans is more valuable than a code that matches exactly.

  • Aim for at least 4.5:1 contrast, not the 3:1 minimum.
  • Avoid pure red on black and other vibrating pairs.
  • Print a physical proof before a full run.
  • Never invert the modules and background.

Sources and review

This page is reviewed by the QRKit Editorial Team. Recommendations are based on practical testing, public platform documentation, and common failure modes reported by users. Test the final code on the exact devices and materials you plan to use.

Frequently asked questions

Which colours scan best?

Very dark foregrounds such as black, navy or deep green work best on white or pale backgrounds. The contrast check blocks combinations below 3:1 and warns below 4.5:1.

Can I use a transparent background?

Yes, PNG and SVG downloads support transparency. Make sure the surface behind the code is light enough and that the code still has strong contrast in the final layout.

Why did my coloured code fail to scan?

The most common causes are low contrast, inverted colours, a background image showing through, or printing too small. Generate a new code with stronger contrast and test it again.

Is a coloured code suitable for professional printing?

Yes, if the contrast is strong and you supply the SVG. Vector output keeps the modules sharp at any physical size, while a PNG can blur when a printer enlarges it.