Convert PNG to WebP
Turn PNG images into WebP for your website, with transparent backgrounds kept. Photos and screenshots saved as PNG usually shrink a lot; tiny flat logos may not, and the result shows both sizes so you keep the smaller one. Your images are never uploaded.
Drop PNG files here or click to choose
Converted on your device — never uploaded
How to convert PNG to WebP for a website
- Add one or more PNG files and start with quality 80.
- Compare the original and WebP sizes on each result row.
- Open the result and check small text, gradients and transparent edges.
- Download the WebP only when it is smaller and still looks right.
Three kinds of PNG, three different results
“PNG” covers very different pictures, and the format you convert to cares a great deal about which one you have. We drew three typical ones in a measurement script — a landscape photo, an app screenshot and a flat logo on a transparent background — optimised each PNG first so the comparison is fair, then converted them with the same encoder and default quality this page uses.
| Test image | PNG | WebP | Change |
|---|---|---|---|
| Photo saved as PNG (1600×1067) | 1,665.6 KB | 90.3 KB | −95% |
| App screenshot (1280×800) | 105.4 KB | 42.2 KB | −60% |
| Flat logo, transparent (512×512) | 5.4 KB | 8.4 KB | +56% |
A photo stored as PNG is the big win. PNG keeps every pixel exactly, including grain and texture nobody can see the value of, so a lossy format has a lot to drop. If a phone, a screen-capture tool or an export dialog handed you a photo as PNG, this is the conversion you want.
A screenshot still shrinks well, but it is the case to check by eye: lossy encoding can soften small text. Zoom into the result before you publish it, and nudge the quality up if letters look smudged.
A small flat graphic is where WebP, as written here, is the wrong tool. PNG compresses large areas of one colour extremely well, and lossy WebP spends bytes approximating edges it cannot reproduce exactly. Keep the PNG — or, for a logo, an SVG if you have one.
Transparency survives the trip
This is the reason to pick WebP over JPG for graphics: JPG has no transparency at all and would paint your background white. The encoder here keeps the alpha channel at full quality while compressing the colours. In our logo test the decoded alpha channel matched the original value for value, anti-aliased edges included, so the logo still sits cleanly on a dark page header.
When to keep the PNG
- It is your editable source. WebP is the delivery copy; the PNG is what you open again next month.
- Every pixel has to be exact — sprite sheets, pixel art, diagrams someone will measure.
- The file is going to print, to a document, or to software you do not control.
- It is an icon for a browser tab or a home screen; those have their own formats.
Like any decode-and-encode tool, this one writes a new file from pixels only: text chunks, embedded colour profiles and other PNG metadata are not carried over.
Frequently asked questions
Are my PNG files uploaded anywhere?
No. The PNG is decoded by your browser and encoded to WebP by a WebAssembly build of libwebp running in this tab. The page, the encoder download and the ads make their own network requests, but your images are not part of them.
Does WebP keep the transparent background?
Yes. WebP has a real alpha channel and the encoder stores it at full quality even while the colours are compressed lossily. On our transparent test logo, all 109,456 fully transparent pixels were still fully transparent after conversion. The colour values hidden under fully transparent pixels can change, which has no visible effect.
Why did my PNG get bigger as a WebP?
Because it was a small graphic with a few flat colours, which PNG already stores very efficiently. This tool writes lossy WebP, and lossy encoding is built for photographs, not hard-edged shapes. Our flat logo went from 5.4 KB to 8.4 KB. When that happens, keep the PNG — the result row shows both sizes so you can tell straight away.
Can I make a lossless WebP here?
Not on this page: it always writes lossy WebP, with the slider as the quality setting. If you need the PNG pixel-exact but lighter, run it through the PNG option of the image compressor instead, which optimises the PNG without changing a single pixel.
What quality should I use for screenshots with text?
Start at 80 and zoom into the smallest text in the result. If letter edges look soft or have faint halos, try 85–90. Our screenshot test image went from a 105.4 KB PNG to a 42.2 KB WebP at 80; higher settings give back sharpness at the cost of some of that saving.
Is a WebP icon a good favicon?
Usually not. Browsers and operating systems still look for favicon.ico and PNG icon sizes in specific places. Use the favicon generator for that job and keep WebP for images inside your pages.