How the image format converter works
The browser decodes the source pixels, draws them onto a clean canvas, fills a background when JPEG output requires it, and encodes the canvas in the selected supported format.
output file = encode(decoded pixels, selected format, quality)PNG and WebP can preserve transparency; JPEG replaces transparent pixels with the selected background color.
Convert transparent PNG assets to WebP
Choose WebP output, set the desired quality, and process the batch. Transparent pixels remain transparent, while the new files use the .webp extension and omit embedded source metadata.
Using the processed image
Keep the exported dimensions, format, transparency, and compression level appropriate for where the image will be used.
canvas.toBlob(handleBlob, "image/webp", 0.85);context.fillStyle = "#ffffff";
context.fillRect(0, 0, width, height);
context.drawImage(bitmap, 0, 0);Using the result accurately
Use PNG when lossless pixels or broad transparency support matters, JPEG for opaque photographs, and WebP when modern web compression and optional transparency fit the delivery requirements.
The first release does not accept GIF, SVG, HEIC, or AVIF and does not preserve animation. Browser format support can differ, and conversion does not improve detail already lost in a compressed source.
References: MDN HTMLCanvasElement toBlob().