PNG to WebP Converter
Convert logos, icons and cut-out images from PNG to WebP without losing their transparent background. WebP stores an alpha channel in both its lossy and lossless modes, so transparent and semi-transparent pixels carry over, and lossy WebP at the default 88% quality is usually far smaller than the PNG. Runs entirely in your browser using the Canvas API.
Drop an image or click to choose
JPG, PNG, WebP, AVIF, GIF and more, up to 50 MB. Runs in your browser.
FROM
PNG
TO
WebP
QUALITY 88%
How it works
The PNG is decoded with its alpha channel and drawn onto a transparent canvas, so cut-out edges and soft shadows keep their transparency. canvas.toBlob('image/webp', quality) then encodes it; the download button reads WEBP, or PNG if your browser cannot encode WebP.
Processing runs in your browser
All conversion happens using the Canvas API inside your browser. Our servers are not involved at any point.
Related operations
To shrink the file size after converting, try compress image. For resizing converted images to fit a target, use resize image. To trim the converted image to an aspect ratio, see image crop.
Frequently asked questions
- Does WebP preserve PNG transparency?
- Yes. WebP supports an alpha channel, so transparent areas in your PNG remain transparent in the WebP output.
- How much smaller will the WebP be?
- Lossy WebP, the output at the default quality, is typically 60-80% smaller than the source PNG for photographic content. At 100% quality Chrome and Edge write lossless WebP, which saves about 26% compared to PNG.
- Does the transparent PNG leave my device?
- The PNG is decoded and re-encoded as WebP in this tab, alpha channel included, and the WebP is saved to your device when you click Download. Our servers are not involved at any point.
- Where is WebP supported?
- Every major modern browser supports WebP, including Chrome, Firefox, Safari, and Edge. CMS platforms and image editors increasingly support it too.
Last reviewed September 30, 2026
Other pages for this tool
Related tools
- Background reading: Complete guide to image tools
- Step by step: Optimize images for the web