Transparent Background Images: Which Formats Support Them and How to Keep Transparency

Transparency breaks more often than any other image feature — usually because someone saved a logo as JPG. Here is exactly which formats hold transparency, what goes wrong, and how to fix it.

Which formats support transparency

The single most common mistake

Saving a transparent logo as JPG. JPG has no alpha channel at all, so every transparent pixel is filled with a solid colour — usually black, sometimes white, depending on the software. There is no way to recover it afterwards; you have to go back to the original.

If you need a JPG version of a transparent logo, decide the background colour deliberately rather than letting the encoder choose for you.

What "full alpha" actually means

Alpha is a fourth channel alongside red, green and blue that records how opaque each pixel is, from 0 (fully transparent) to 255 (fully solid). That range is what gives a logo smooth, anti-aliased edges over any background colour.

GIF only stores one bit: visible or not. That is why GIF logos show a jagged white halo when placed on a dark background — the semi-transparent edge pixels were forced to full opacity against the original white backdrop.

Converting without losing transparency

• PNG → WEBP — transparency preserved, files typically 25–30% smaller.
• WEBP → PNG — safe, use our WEBP to PNG converter.
• SVG → PNG — safe, use our SVG to PNG converter and export at 2× the size you need.
• Anything → JPG — transparency is lost, always.
• GIF → WEBP — upgrades 1-bit transparency to smooth alpha, though the original hard edges remain.

Choosing a format for your use case

• Website logo — SVG first, PNG as fallback.
• Product cut-out on a marketplace — check the rules; most require a solid white JPG background.
• Watermark overlay — PNG with partial alpha, around 20–40% opacity.
• Email signature — PNG. Many email clients ignore WEBP and SVG entirely.
• App icon — PNG at every required size; use our favicon generator.
• Print — TIFF or a vector file. Talk to your printer before exporting.

Why your transparent PNG looks wrong

Grey and white checkerboard in the file

That pattern is your editor drawing "nothing here". It is not part of the image. If it appears in the exported file itself, the checkerboard was flattened into the picture — undo, and re-export with transparency enabled.

White box behind the logo on your site

Usually the file is a JPG renamed to .png, or the CSS applies a background colour to the element. Check the file in an editor first, then check the stylesheet.

Dark halo on a light background

The image was originally cut out against a dark backdrop and the semi-transparent edge pixels kept that colour. Re-cut the subject or shrink the selection by a pixel before exporting.

Transparency lost after upload

Many CMS platforms auto-convert uploads to JPG for performance. Look for an image-optimisation setting and exclude PNG and WEBP from lossy conversion.

Keeping transparent files small

Transparent PNGs get heavy fast. Reduce the colour palette to 256 where the artwork allows, crop away empty space, and export at the exact display size. Then convert to WEBP for the web version — you keep the alpha and lose a third of the weight. See the image compression guide for the full method, and the formats explained guide for the wider picture.

Gear we recommend for this workflow

As an Amazon Associate we earn from qualifying purchases. Affiliate disclosure.

Wacom Intuos Small, Wired Graphic Drawing Tablet with Pen + Software | Battery-free pen, 4 ExpressKeys for shortcuts, works with Mac, Windows & Chromebook; Ideal for creators, students & teachers

Best for precise retouching and illustration

$39.95

Check price on Amazon

Adobe Photoshop | Photo, Image, and Design Editing Software | 12-Month Subscription with Auto-Renewal, PC/Mac

Best for professional photo editing

$263.88

Check price on Amazon

Drawing Tablet XPPen StarG640 Digital Graphic Tablet 6x4 Inch Art Tablet with Battery-Free Stylus Pen Tablet for Mac, Windows and Chromebook (Drawing/E-Learning/Remote-Working)

Best budget drawing tablet

$28.99

Check price on Amazon

Logitech MX Creative Console 9 Customizable Keys - Graphite | Control Dial, for graphic design, Zoom and Spotify, includes 3-Month Adobe Cloud Membership, Stream Deck Accessories

Best for design shortcuts and multimedia work

$169.99

Check price on Amazon

Prices as of Oct 22, 2026, 4:41 AM UTC. Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon.com at the time of purchase will apply to the purchase of this product.

Starting from a photo or logo on a white or plain background? The make background transparent tool removes a solid background in your browser and saves a PNG with a real alpha channel.