WebP vs PNG: Which Should You Use?

The short answer is that WebP is smaller, but the short answer is misleading. WebP is really two different formats sharing a name, and PNG still wins in a handful of specific, predictable situations. Here's how to tell which one you're in.

WebP is two codecs wearing one name

Most confusion about WebP starts here. Lossy WebP, released in 2010, is derived from the intra frames of the VP8 video codec; it compresses like a video keyframe and throws data away to do it. Lossless WebP, added in 2012, is a completely separate codec designed from scratch for lossless work, and it shares nothing with the lossy one except the file extension.

Most people only know the lossy one, so "WebP" has a reputation as a photo format that smudges fine detail. That reputation belongs to only one of the two codecs. The other is one of the best lossless image compressors in common use, and it is badly underused.

What PNG gets right

PNG dates to 1996 and is lossless by definition: every pixel comes out exactly as it went in. Under the hood it runs DEFLATE compression over per-row prediction filters, where each row is predicted from its neighbors and only the difference is compressed. It stores 8 or 16 bits per channel and has full alpha transparency.

Its biggest advantage, though, isn't technical. After roughly 25 years, PNG is supported everywhere: every browser, OS preview, editor, upload form, and printer portal ever written can open it. No other lossless format can say that, and it matters more often than compression ratios do.

The chroma subsampling problem

This is the most important thing to know before reaching for WebP: lossy WebP only supports 4:2:0 chroma subsampling. In plain terms, the format splits an image into brightness and color, keeps brightness at full resolution, and stores the color at a quarter of the resolution, one color sample for every 2x2 block of pixels. There is no quality setting, however high, that turns this off.

For photographs this is invisible. Your eyes are far more sensitive to brightness than to color, and photos rarely have color changing sharply from one pixel to the next, which is why video codecs (where the technique comes from) have used it for decades.

Point it at a sharp colored edge, though (red text on white, a UI screenshot, line art, a logo), and the quarter-resolution color smears across the edge. You get fringing and bleeding around every colored letter, and raising the quality slider to 100 does not fix it, because the data was never stored. If you've ever wondered why a screenshot saved as WebP looks subtly greasy around the text, this is why.

Lossless WebP: the underused one

The 2012 lossless codec has none of these problems. It is pixel-perfect, handles alpha, and typically produces files around 25% smaller than an optimized PNG of the same image. For graphics, logos, and screenshots delivered on the web, it is simply a better PNG.

Two caveats keep it from being a full replacement. It is 8-bit only, where PNG goes to 16 bits per channel, so it can't serve as an editing or print master. And while browser support is universal, support in the long tail of desktop software, enterprise systems, and image pipelines is noticeably weaker than PNG's.

Where PNG is still the right choice

• Anything needing 16-bit channels, such as editing masters, print pipelines, and scientific or medical images. WebP tops out at 8 bits per channel and can't hold them.
• Files sent to unknown recipients. Email clients (notably Outlook), older desktop software, government and enterprise upload forms, and some CMSes and printing services still reject WebP outright. When you don't control what opens the file, PNG does.
• Favicons and OS-level assets. The conventions expect PNG or ICO, and everything downstream (crawlers, pinned tabs, home-screen icons) is built around them.
• Screenshots headed into documentation pipelines that assume PNG at every step.
• Archival masters. Every tool that will ever exist opens PNG. That's the whole argument, and it's a good one.

Where WebP wins

WebP wins at web delivery. Anywhere you control the display context (your own site, your own app), it is the better format to ship for both kinds of image: lossy WebP for photos, lossless WebP for graphics. Browser support has been universal since Safari 14 landed around 2020, so the old habit of keeping a PNG fallback is no longer necessary for browsers.

For photos, "WebP vs PNG" is usually the wrong comparison in the first place. PNG was never the right format for photographs, because lossless compression makes photo files balloon. The real photo-on-the-web contest is lossy WebP (typically 25–35% smaller than an equivalent-quality JPEG, with alpha support JPEG lacks) against JPEG and AVIF, which is the stronger modern option for photos. PNG only enters the conversation for graphics, screenshots, and masters.

The decision in one table