PNG to WebP converter
Convert PNG images to WEBP format
WebP is the one common raster target that takes everything a PNG has: full 8-bit alpha, sharp edges, flat colour. That makes this pair unusual - most conversions away from PNG cost you the transparency, and this one does not. What you are trading is exactness for size. At the default quality of 90 the encoder rewrites the image in YUV with chroma at half resolution, which is invisible on photographs and screenshots but can soften a one-pixel red line on a dark field. Push the slider to the top and Chromium switches to WebP's lossless mode instead.
Key facts about PNG to WebP converter
| Alpha channel | Kept. WebP stores 8-bit transparency, so soft shadows, rounded corners and cut-out logos come through as they were. |
|---|---|
| Encoder | The WebP encoder compiled into your browser, reached through the canvas - no separate library is downloaded for this pair. |
| Lossy mode | Anything below quality 100 is lossy: colour is stored at half horizontal and vertical resolution while luma stays full-size. |
| Lossless mode | At quality 100 Chromium-based browsers write a lossless WebP, which reproduces the PNG pixel for pixel and still usually beats it on size. |
| Typical size delta | A 450 KB 1920x1080 PNG screenshot lands around 90-140 KB at quality 90; a flat-colour logo often drops below a fifth of the PNG. |
| Animation | An APNG input is flattened to its first frame, and the output is always a still image - this pair cannot build an animated WebP. |
| Ancillary data | The WebP is written from canvas pixels alone, so tEXt chunks, the embedded colour profile and any creation date in the PNG are dropped. |
| Viewer support | Every current browser, Windows Photos on Windows 10 and later, macOS Preview since Big Sur. Older Office builds and some print vendors still refuse .webp. |
| Batch and cap | Twenty files per run, 500 MB each, and multiple results come back as converted-webp-files.zip. |
What happens to your file
Nothing about this conversion touches the network. The PNG is read from the file picker into an object URL, decoded by the browser, painted to an off-screen canvas element, and then canvas.toBlob is called with image/webp and your quality value - that call hands the pixels to the WebP encoder already inside the browser binary. The finished blob lives in this tab's memory until you download it or leave the page, and the tool keeps working with the network cable unplugged.
About this tool
- 1
Load your PNGs
Drag in as many as twenty .png files. Transparent source images are fine here; there is no background fill step in this direction.
- 2
Choose lossy or lossless
Leave the slider at 90 for the smallest sensible file, or drag it to 100 if the image is line art, a diagram or a UI asset that must stay exact.
- 3
Resize first if the asset is oversized
A 4K export destined for a 800 px card should be downscaled with the presets - the encoder cannot save you from unnecessary pixels.
- 4
Convert and compare
The result panel shows the old and new byte counts and a side-by-side view; download the .webp or the ZIP when the edges look right.
| Input and output | Takes .png only (image/png) and returns .webp with the image/webp type; any other extension is refused before decoding. |
|---|---|
| Conversion path | PNG to WEBP runs in three steps: an <img> element hands the file to the browser's own PNG decoder; the pixels land on a 2D canvas in this tab; then canvas.toBlob with the image/webp type returns the finished file. |
| Browser support | The PNG side decodes in every browser ever shipped, while writing the WebP works in Chromium browsers and Firefox, and where the type is unsupported the canvas specification makes the browser return PNG bytes under the .webp name. |
| Controls for this pair | A 30 to 100 quality slider (steps of five, default 90) drives the WEBP encode, max-dimension presets from 3840 down to 200 px resize the PNG first, and the strip-metadata toggle is moot on this pair. |
| Batch, caps and naming | Twenty PNG files per run at 500 MB each; one result downloads as a single WEBP, several as converted-webp-files.zip, zipped by JSZip 3.10 in page memory. |
| Device ceiling | The canvas caps it: past roughly 16,384 px a side Chromium refuses the bitmap and iPhone Safari gives up sooner, so an oversized PNG fails before any WEBP bytes exist. |
- Check a converted asset against a dark background - chroma subsampling shows first as colour bleeding along high-contrast edges, and that is invisible on white.
- For icons and diagrams the lossless setting is usually both smaller and safer than quality 95, so there is little reason to sit in between.
- Serve WebP with a PNG fallback only if you still support browsers older than 2020; every shipping browser has decoded WebP for years.
- Screenshots of code or spreadsheets are the case where quality 100 earns its extra kilobytes, because every glyph edge is a hard transition.
- Cutting the weight of a site's PNG interface assets without rebuilding them as SVG.
- Preparing product shots with transparent backgrounds for a storefront theme that accepts WebP.
- Shrinking a folder of exported design mockups before sharing them in a chat thread.
Related tools
View allNeed the opposite? Try WEBP to PNG
Works well with this4
Other PNG tools12
Updated