Why PNG is expensive on a web page
PNG is the format most graphics leave a design tool in, and for good reason: it is lossless and it keeps transparency. On a live web page, though, it is usually the heaviest file in the request list. A hero illustration exported at 2400 pixels wide can weigh 1.5 MB, and a product photo saved as PNG by mistake can be 5 MB where a lossy version would be 300 KB. Every one of those bytes is downloaded on every visit, which is why page-speed tools keep nagging about next-gen formats.
WebP was built for exactly this. It has been supported by every current browser since Safari 14 in 2020, so today well over 95 percent of visitors can display it without a fallback. Converting here runs libwebp compiled to WebAssembly inside a Web Worker, so your file never leaves the device.
Lossy colour, exact transparency
This converter uses WebP in its lossy mode. That matters for what you get back:
- Colour data is compressed the way a JPG is, with detail removed according to the quality slider. It is not a pixel-exact copy of the PNG.
- The alpha channel is kept, and it is stored losslessly. Soft shadows, anti-aliased edges and semi-transparent glass effects survive intact, which is the main reason to prefer this over PNG to JPG for graphics.
- Colour under fully transparent pixels may be altered by the encoder. That is invisible in normal use but can surprise you if you later remove the transparency.
- Any text chunks, ICC profile and EXIF inside the PNG are discarded. The image is decoded through a canvas and comes out as plain sRGB with its original dimensions.
If you need a lossless WebP, for example for a pixel-art sprite sheet, this tool is the wrong choice: keep the PNG or run a lossless encoder on your machine.
Picking a quality value
The slider covers 20 to 95 and defaults to 80. WebP tends to soften fine texture rather than produce the blocky ringing JPG is known for, so it is forgiving at moderate settings. Flat illustrations, icons and screenshots of interfaces look clean at 80 to 85. Photographic content is fine at 75 to 80. Gradients and large areas of a single hue can show faint banding at 60 and below, so avoid the low end unless size is all that matters.
Typical numbers from real conversions, which will vary with the content:
- A 1200x800 logo lockup with transparency, 320 KB as PNG, comes out around 45 to 70 KB at quality 80.
- A 2560x1440 screenshot of a dashboard, 2.1 MB as PNG, usually lands between 250 and 400 KB at quality 80.
- A 3000x2000 photo that someone saved as a 9 MB PNG typically drops to 500 to 800 KB.
Preview the result at 100 percent zoom before you replace the original. Thin coloured lines on a busy background are the first thing to degrade.
WebP or AVIF
AVIF usually beats WebP by another 20 to 40 percent on the same image, but it takes several times longer to encode and still has gaps in support in older Safari, some Android WebViews and most desktop software. For a public website the pragmatic setup is a WebP file served through the picture element with a PNG or JPG fallback, and AVIF added on top once you have measured the gain. The PNG to AVIF page produces the AVIF variant, and WebP vs AVIF vs JPEG walks through the trade-offs with numbers.
What this converter does not do
It does not resize. A 4000-pixel-wide WebP is still too wide for a 1200-pixel content column, so scale the image with Resize image first if the dimensions are the problem. It does not write metadata, so if a copyright notice must travel with the file, add it with a visible watermark instead. It does not animate: a static PNG in gives a static WebP out. And it has no server, so very large images depend on how much memory your browser can allocate for a canvas.