How to make a QR code with a company logo — and is it safe for scanning

I'll tell you how I see it after years of making these codes for clients. The black-and-white square works. It scans perfectly. It just looks exactly the same as your neighbor's code, the competitor's code, and the code on the flyer someone dropped in your mailbox. Nothing special.

And now place the logo in the center. Suddenly, a person sees whose code it is before they even bring their phone close. And they are more willing to scan because they see a brand they recognize. The difference in scans can be significant.

The question that is always asked at this stage: "won't this break my scanning?". No. Provided that you don't do it haphazardly.

Why doesn't the logo blow up the entire QR code with the logo into the air

Here is a little magic that is worth understanding. Every QR code has error correction embedded within it. It is a kind of redundant data baggage that allows the reader to reconstruct the whole, even if a piece of the code is dirty, crumpled, or covered by something.

At the highest level (marked with the letter "H") the code will survive a coverage of about 30% of the surface. The logo in the middle usually eats up 20–25%. This means you fit, and with plenty of room to spare.

Two things I always stick to:

1. The logo goes right in the center. Never in the corners. These three thick squares in the corners are position markers; the reader uses them to determine where the top and bottom are. Cover one and that's it, the code is dead.
2. Give the logo a white border. A thin margin all around. It separates your graphic from the "pixels" of the code and really helps with readability, especially when the logo has a ragged, irregular shape.

Step-by-step work

In cutty.dev you do this while shortening the link, because a QR code is automatically included with every link. Let's go:

1. Shorten the link or open one you already have in the panel.
2. Go to the "QR Code" section on the editing page.
3. Upload your logo (PNG, SVG, JPG, whatever you have). It lands in the center, and error correction automatically jumps to a higher level. You don't need to click anything.
4. Match the code and background color to your brand.
5. Download. PNG for screen and social, SVG for print (it scales without loss of sharpness, so use SVG specifically for banners or roll-ups).

Preview refreshes live. You see the effect before anything lands on the disk.

Watch out for this: colors can trick you

This is that one moment where people most often fail, so listen closely.

The scanner does not read colors. It reads contrast. You can paint the code, please do, but stick to the rule: dark code on a light background. Not the other way around. Light code on a dark background, sure, it will scan on your flagship phone, and then a client with an older Android stands there cursing because nothing is being captured.

And do not place the code color too close to the background color. Navy blue on black? Forget it. The greater the contrast, the more confidently the code is captured from a distance (and on a store website or a poster at a bus stop, this actually matters).

The matter no one will tell you about: where your logo lands

Most logo code generators require you to upload a file to their server. And stop right there for a second. Your brand identity, sometimes the only decent vector version, ends up with a third-party provider. And the terms and conditions may include the right to further use of this file. Has anyone ever read those terms and conditions? Exactly.

With us, the code is generated in your browser. Logo does not leave your computer, is not sent anywhere, nor is it saved. The file remains yours.

Print once, direct wherever you want

Finally, a tip that will one day save you a lot of money on reprinting.

Create the code from a shortened link, not from a raw, long address. Why? Because a code based on a short link can be replaced from the inside later. You change the link's destination in the panel, and the same printed code suddenly leads somewhere else. Did a promotion end? You redirect to a new one without touching the flyers.

Code embedded directly into a long address is set in stone. Change of purpose = new code = new print = new bill from the printing house. Think about it before you order a thousand business cards.