Skip to content

QR Code Generator with Logo

Custom QR codes with your colors and a logo in the middle. Built in your browser, downloaded as PNG or SVG, no signup.

In your browser—your files never leave your device.

Learn more

300 × 300px

Encoded: https://example.com (19 bytes)

or drop a PNG/SVG here

Logos sit on top of the QR pattern. Keep them ≤20% of the code area and use a transparent or solid background so scanners stay reliable. Error correction is auto-bumped to H when a logo is added.

About this tool

Most QR generators online are either ugly black-on-white squares or paywalled the moment you want a logo. This one isn't. Paste a URL, Wi-Fi config, vCard, or any text into the input field. Pick a preset (Modern, Classic, Ocean, Sunset, Forest, Midnight, Dark, and a few more) or open the customize panel for fine control over hex colors, dot style, corner shape, and gradients. Drop in a logo if your brand has one and the tool auto-bumps error correction to handle the obstruction. The preview updates as you type, and the export is either a PNG for screens or an SVG for print. The whole thing runs in your browser, which means the content you encode never leaves your device. I built it that way because there's no reason a QR generator should know what URLs you're scanning.

How to qr code generator with logo

  1. Paste what you want encoded

    A URL, plain text, a phone number (tel:), Wi-Fi credentials (WIFI:S:...), or a vCard block. Any of those goes straight into the textarea at the top. The preview starts drawing the QR as soon as you have at least one character in the field.

  2. Style it

    Pick one of the eight presets (Modern is the default and works for most use cases) or click Customize to open the panel with hex colors, dot style (square, rounded, dots, extra-rounded, classy, classy-rounded), corner shapes, and linear/radial gradients. Drop in a logo if you want one. The preview updates as you go so you can see exactly what you'll be downloading.

  3. Download PNG or SVG

    PNG for screens, emails, slides, and anywhere it'll be viewed at one fixed size. SVG for print, packaging, posters, business cards, and anywhere the QR might get resized. The PNG download size is set by the size dropdown in the customize panel (default 300px, up to 1000px); SVG ignores size because it's vector.

  4. Scan it before you ship it

    I always test the code with my phone camera before sending it anywhere. Logos placed too large will sometimes break the scan, and you only find out the embarrassing way. Test in worse lighting than the final use case will have, and test with both a current iPhone and a mid-range Android if you have access to both, because their scanners disagree on edge cases.

Why use this tool

I built this because every free QR generator I tried either had a watermark, a per-day cap, or wanted my email before letting me download an SVG. None of that here. The library underneath is qr-code-styling, which is the same one a lot of paid QR services white-label. It handles error correction levels properly, so when you drop a logo in the middle, the code automatically bumps to level H (30% redundancy) and stays scannable. Use it for posters, business cards, restaurant menus, Wi-Fi sharing at home, event tickets, vCards for conferences, packaging labels, or anything else you used to need a paid service for. The PNG output is high-res by default. SVG scales to billboard size without blurring. And because everything runs locally, you can generate QR codes for internal links, beta URLs, staging environments, or anything else you wouldn't want logged on someone else's server. There's also no per-day cap, so if you're making 200 QR codes for an event's seating cards, this won't cut you off halfway through.

Features

Custom colors and gradients

Set foreground and background hex values directly, or use the color picker if you're not great with hex. Apply linear or radial gradients between two colors with an adjustable rotation slider (0 to 360 degrees). Eight built-in presets cover Modern, Classic, Dots, Ocean, Sunset, Forest, Midnight, and Dark looks. Stop using black-on-white squares when your brand uses different colors. Dark presets exist for inverted layouts where black-on-white would look out of place.

Logo in the middle

Drop in a PNG or drag one onto the upload area. The tool auto-bumps error correction to level H (the highest, with 30% redundancy) the moment you add a logo, so the QR stays scannable even with the center 20-25% covered. The library handles the placement automatically and hides the background dots under the logo so it looks clean rather than crammed in. Smaller logos are safer for print; larger logos look better on screens.

PNG or SVG output

PNG comes out at the size you pick (200, 300, 400, 600, 800, or 1000 pixels) and is fine for emails, slides, web pages, and anywhere screens are the destination. SVG scales without blurring, which matters the moment you put a QR on anything bigger than a business card. Posters, banners, packaging, signage, and anything destined for a commercial printer should use SVG because the file stays sharp at any scale.

Six dot styles plus corner styles

Pick between square (the classic look), rounded, dots, extra-rounded, classy, or classy-rounded for the data dots. Independently set the corner-square style (square, dot, extra-rounded) and corner-dot style (square, dot). This level of control is what paid services charge for; here it's in the customize panel for free. Different styles read better at different sizes; rounded shapes are forgiving at small print sizes while square is densest.

Generates locally, no tracking

The QR is built in your browser using the qr-code-styling library (the same one a lot of paid QR services white-label). The text or URL you're encoding never reaches a server. I built it that way on purpose so it works for internal links, staging URLs, draft marketing campaigns, and anything you'd rather not have logged on someone else's server. Open dev tools and watch the Network tab while you generate; zero outbound calls.

Encodes most things

URLs, plain text, email addresses (mailto:), phone numbers (tel:), SMS templates (smsto:), Wi-Fi credentials (WIFI:S:...), vCards (BEGIN:VCARD), geo coordinates (geo:lat,lng). Anything that fits in 2,953 bytes works. The tool catches over-capacity content (huge JSON, base64 images, etc.) and shows a friendly message telling you the byte count and suggesting a URL shortener, instead of silently breaking the QR.

Privacy & security

Encoding a QR code is deterministic math — the same input always produces the same matrix of black and white squares. The library doing that math (qr-code-styling) runs in your browser. The URL, Wi-Fi password, vCard, or whatever you encode never gets transmitted; it stays in your tab as a string that the encoder turns into pixels. Logo embedding draws your uploaded image onto a canvas on top of the QR matrix, also in the browser. When you click download, your browser writes the PNG or SVG to disk from memory.

Frequently asked questions

Is it free?
Yes. No signup, no per-day cap.
Where does my data go?
Nowhere. The code is generated in your browser using JavaScript. I built it that way on purpose.
What can I encode?
URLs, plain text, email addresses, phone numbers, Wi-Fi credentials, vCards, SMS templates, and geo coordinates.
Can I add a logo?
Yes, upload any PNG. Keep the logo under about 20% of the QR's area or you'll start losing scan reliability on smaller print sizes.
What's an error correction level?
The redundancy baked into the QR. Level L recovers from about 7% damage, M about 15%, Q about 25%, H about 30%. Higher levels mean more dots packed into the same space, so the QR looks denser but tolerates more covering or wear. The tool defaults to Q and bumps to H automatically when you add a logo.
How much data fits in a QR code?
About 4,296 alphanumeric characters at the upper bound, or 2,953 bytes of binary. For URLs, keep them under 2,000 characters or scan reliability drops on cheaper phone cameras. If your content exceeds the limit, the tool tells you instead of generating a broken QR.
Will every phone scan it?
Yes. Every iPhone since iOS 11 and basically every Android camera since 2018 reads QR codes natively.
Should I print at PNG or SVG?
SVG. Always SVG for anything bigger than a business card. PNG is fine for emails, slides, and screens. The moment the QR ends up on a poster, sticker, or anything that'll get resized in InDesign, the SVG keeps the edges crisp where the PNG would blur and start failing scans.
How small can I print a QR code?
The general rule is 2 cm by 2 cm (about 0.8 inches) minimum at typical reading distance. Smaller works for close scanning, but anything under 1.5 cm starts losing reliability on cheaper phone cameras, especially in mediocre lighting. If you need to fit a QR on a tiny label, bump error correction to H, use a short URL, and test with at least three different phones before committing to a print run.
Can I encode Wi-Fi credentials?
Yes. The format is WIFI:S:NetworkName;T:WPA;P:Password;; (replace network name and password). Most phones recognise it and offer to join the network when scanned. Hospitality businesses use this trick all the time for guest Wi-Fi without writing the password on a chalkboard.
What's a vCard QR and how do I make one?
A vCard QR encodes contact info (name, phone, email, company, website) so scanning it pulls everything into the phone's contacts app in one tap. The format starts with BEGIN:VCARD VERSION:3.0 and then a series of FN, TEL, EMAIL, ORG, URL lines, ending with END:VCARD. Paste the whole block into the input. Useful for business cards if you want people to save your details without typing.
Are there any limits?
No quota on how many you generate. PNG output is high-res by default and SVG scales infinitely.