QRdx
HelpGuidesDevelopersReact librarySelf-hosting
Designing

Add a logo

Put your logo in the center of a QR code without breaking scanning.

  1. In the playground, open the Design tab, then Logo.
  2. Turn on Logo in the center.
  3. Pick one of the Quick icons, or click Upload your logo.
  4. To change it later, click Replace or Remove.

Logos can be PNG, JPG, WebP or SVG files up to 1 MB. A transparent PNG or an SVG looks best.

Set error correction to High

A logo covers some of the code's squares. Error correction rebuilds them when the code is scanned.

Open Error correction in the Design tab and choose High whenever a logo is on. High lets up to 30% of the code be covered.

If the score drops

QRdx sizes the logo for you. If the Scan score drops after you add it, check that Error correction is set to High.

If it still struggles, try Logo QR, which keeps every square in place.

Want the logo in the dots instead?

Logo QR paints the dots inside your logo's shape, rather than placing the logo on top. See Blend a logo or photo into the code.

Last updated on

Choose colors that scan

Keep a dark code on a light background, keep strong contrast, and use gradients carefully.

Add a frame and a call to action

Put a border and a short message like "Scan me" around your QR code.

On this page

Add your logoSet error correction to HighIf the score dropsWant the logo in the dots instead?Related