Convert PNG to WebP

Convert PNG images to WebP in your browser. Typically a quarter to a third of the size, with the transparent background preserved.

Drop PNG files here or paste from the clipboard.

Your files are processed on this device. Nothing is uploaded.

What actually changes

WebP encodes the same picture far more efficiently than PNG, with an alpha channel that behaves the same way, so a transparent background stays transparent. The output here is lossy WebP, which is where the large savings come from: a logo or screenshot commonly drops to a quarter of its PNG size with no visible difference at normal viewing scale. Everything a browser understands about the image survives; what doesn’t survive is anything that was stored in PNG text chunks.

PNGWebP
CompressionLosslessLossy
TransparencyYesYes
Format can be animatedNoYes

WebP is a web format and it shows outside the browser

Every current browser reads WebP, which makes it excellent for a website and awkward everywhere else. Older versions of Office and Photoshop, print shops, photo labs, e-readers, digital picture frames and plenty of upload forms will refuse it or simply not preview it. Convert to WebP for the web and keep the PNG as the master for anything that leaves the browser.

The easiest performance win on a website

Images are usually most of a page’s weight and WebP cuts that by a quarter to a third for free, in the sense that nobody looking at the page can tell. If you’re working through a site’s performance and wondering where to start, this is the least risky change available.

Keep the PNG. Serve the WebP. When something needs the original, you still have it.

Where lossy WebP is the wrong call

Anything that’ll be edited again and anything where exact pixels matter: a design master, an asset going into an icon set, a screenshot that’ll be annotated and re-exported. Lossy compression on an asset you’ll keep working with is the same mistake as working in JPG.

Transparency handled properly

GIF has one transparent colour, which is why GIF logos have jagged edges on coloured backgrounds. PNG and WebP both store a full opacity value per pixel, so a soft shadow or an anti-aliased curve fades correctly whatever sits behind it. Converting PNG to WebP keeps that intact, which is why it is a safe swap for interface assets.

Last updated

Common questions

How much smaller is WebP than PNG?

For screenshots and graphics with flat colour, usually a third to a quarter of the size. For photographs mistakenly saved as PNG, often a tenth or less, because PNG is a poor fit for photographic data in the first place. The quality slider controls where on that curve you land.

Does the transparency survive?

Yes. WebP has a full alpha channel, not just a single transparent colour like GIF, so soft edges and partial transparency come through exactly as they were. This is a large part of why WebP replaced PNG for web graphics.

Is the WebP produced here lossy or lossless?

Lossy, at the quality you choose. Browsers can only write lossy WebP from a canvas, so a lossless WebP would need a separate encoder shipped as WebAssembly. At quality 85 and above the difference from the PNG isn’t visible on screen at normal size.

Will this break my site in older browsers?

Only in browsers that predate 2020 or so. Every current version of Chrome, Firefox, Safari and Edge reads WebP. If you need to support genuinely old clients, serve WebP with a JPG or PNG fallback using a picture element rather than replacing the original outright.

Guides

Other things a PNG can become

Other tools