Esc
↑ ↓ to moveEnter to openEsc to close

Free, in your browser, no upload

QR code with a logo in the middle

Add your logo and we place it on a clean plate in the center, raise error correction to the highest level and read the code back to make sure it still scans. The logo stays on your device.

    Design and error correction

    Module style

    More QR and barcode tools

    How to put a logo in a QR code

    1. Enter the link

      Or pick another content type. Shorter content leaves the code less dense, which gives the logo more room.

    2. Add your logo

      Under Design, choose Add a logo. A square logo, or one with a transparent background, looks best on the plate.

    3. Set the size

      Start at 20% of the code’s width. You can go up to 30%; the scan check tells you if a size stops reading.

    4. Download when it passes

      Once the line under the preview says the scan check passed, download PNG, SVG or PDF, and test once on a phone.

    Why a logo does not break the code

    QR codes carry spare data for repairs. At error correction H, a reader can rebuild about 30% of the code’s data from the rest. A logo in the middle hides some modules; the reader treats them as damage and repairs them. As long as the logo covers less than that budget, the code still reads.

    We keep well inside it. The logo sits on a plate that clears the modules underneath, so there is a clean edge instead of half-covered squares, and the three large corner squares are never covered. DENSO WAVE warns that drawings laid over a code can make it slow or impossible to read, which is why every change here is read back before you download.

    How big the logo can be

    The size slider sets the logo’s width as a share of the code. The area it covers grows with the square of that width:

    Logo width and the share of the QR code it covers
    Logo widthShare of the code coveredOur advice
    10%about 1%Very safe, but small on a phone screen
    15%about 2%Safe for any content
    20%about 4%Our default: clearly visible and reliable
    25%about 6%Fine for short links
    30%about 9%The maximum we allow; check older phones

    The plate adds a little margin around the logo, so the covered share is slightly higher than the logo alone.

    What error correction H costs

    Raising error correction to H makes room for the logo, but the same content then needs a larger version, with more and smaller modules. For links of different lengths:

    QR version for links at error correction M and H
    Link lengthLevel MLevel H
    25 charactersVersion 2 (25 x 25)Version 4 (33 x 33)
    40 charactersVersion 3 (29 x 29)Version 5 (37 x 37)
    60 charactersVersion 4 (33 x 33)Version 7 (45 x 45)
    100 charactersVersion 6 (41 x 41)Version 10 (57 x 57)

    So a code with a logo should be printed a bit larger than the same code without one. A short link helps most: it keeps the version low even at level H.

    Design tips that keep it scannable

    Logos and brand colors work when the basics stay intact:

    • Keep the code darker than its background, with a contrast of 4.5:1 or more.
    • Leave the quiet zone at 4 modules, and do not put the code on a busy photo.
    • Use a logo with solid shapes. Fine lines and small text disappear at QR sizes.
    • For a logo with a white box around it, try our background remover first, so only the mark sits on the plate.
    • Test with an older phone as well as your own before you print hundreds.

    Questions

    Does a logo make a QR code harder to scan?

    A little, because the reader has to repair the covered part. With error correction H and a logo under about a quarter of the width, phones read it without trouble. The scan check here confirms each version you make.

    How big can the logo be?

    Up to 30% of the code’s width, which covers about 9% of its area. We stop there so enough repair capacity is left for wear, glare and older cameras.

    Which logo file works best?

    A PNG or SVG with a transparent background, and a simple, bold shape. JPG works too, but its white or colored box shows on the plate.

    Why did my code get busier when I added a logo?

    Error correction switches to H, which uses more of the code for repair data, so the same content needs a larger version. Shorten the link to win the space back.

    Can I change the colors as well?

    Yes. Pick the code and background colors under Design. The tool warns if contrast drops too low or if the code is lighter than its background.

    Do you add a watermark or our own logo?

    No. The code holds only your content and your logo, and it is free to use commercially.

    Is my logo uploaded?

    No. The logo is placed into the code by your browser and is never sent to uncrop.si.

    See all tools