Image Format Converter

What this tool does

This tool converts raster images between PNG, JPEG, WebP, and AVIF formats entirely inside your browser using the HTML Canvas API. No file is ever uploaded to a server. Drop an image, choose a target format, adjust quality if applicable, and download the result.

The 10 MB input limit exists because large images decoded into raw pixel data (RGBA) can exhaust browser memory. A 10 MB JPEG may decompress to 50–100 MB of raw pixels in the Canvas buffer.

Format overview

JPEG — the photograph standard

JPEG (Joint Photographic Experts Group, 1992) uses lossy DCT (Discrete Cosine Transform) compression. It works by dividing the image into 8×8 pixel blocks, transforming them into frequency components, and discarding high-frequency detail the human eye is less sensitive to. The result is excellent compression for photographs — a typical photo at quality 80 is 5–10× smaller than its PNG equivalent with imperceptible loss.

JPEG is terrible for screenshots, diagrams, and text. The 8×8 block artifacts (called "ringing") are highly visible at sharp edges and solid colour regions — exactly what screenshots and diagrams contain. Use PNG for those.

JPEG has no alpha channel (transparency). If your source image has transparent regions, converting to JPEG will fill them with white (the default Canvas background).

PNG — the lossless standard

PNG (Portable Network Graphics, 1996) is lossless — every pixel is preserved exactly. It uses DEFLATE compression (the same algorithm as gzip) on filtered pixel data. Compression ratios are good for images with large uniform regions (diagrams, screenshots, logos) but poor for photographs.

PNG supports full alpha transparency (RGBA). It is the correct choice for logos, UI assets, icons, and any image where pixel-perfect accuracy or transparency is required.

WebP — Google's efficient successor

WebP was developed by Google and released in 2010 from the VP8 video codec technology. It supports both lossy and lossless compression modes, as well as transparency and animation.

Benchmark numbers: WebP lossy is 25–34% smaller than JPEG at equivalent perceived quality. WebP lossless is 26% smaller than PNG on average (per Google's own measurements). Browser support is now universal — Chrome, Firefox, Safari (since 14.0, 2020), Edge.

For web delivery, WebP is almost always preferable to JPEG or PNG when you control the server and know the client supports it. Most CDNs and image optimisation pipelines default to WebP output today.

Lossless WebP is available via the image/webp MIME type with a quality hint of 1.0 on Canvas — though the exact lossless flag support is browser-dependent; Chrome's Canvas implementation exposes it, Safari's may produce lossy output regardless.

AVIF — the next-generation codec

AVIF (AV1 Image File Format) is derived from the AV1 video codec developed by the Alliance for Open Media. Images encoded as AVIF are typically 50% smaller than JPEG at equivalent visual quality — a dramatic improvement.

The catch: AVIF encoding is computationally expensive. Decoding is fast and hardware-accelerated in modern devices; encoding can take seconds to minutes for large images on CPU-only paths. For this reason, the Canvas API does not support AVIF encoding in any browser as of 2026 — canvas.toBlob('image/avif') is not implemented. This tool can decode (display) AVIF input images but cannot produce AVIF output. Output format options are PNG, JPEG, and WebP only.

Browser support: Chrome 85+, Firefox 93+, Safari 16+ (2022).

The Canvas API mechanism

The conversion pipeline has three steps:

1. Decode — the browser decodes the source file into raw RGBA pixel data using its built-in image decoder. This step supports whatever formats the browser natively handles: PNG, JPEG, WebP, AVIF (read), GIF, BMP.

2. Draw — the decoded image is drawn onto an off-screen <canvas> element at the original pixel dimensions. The Canvas holds the raw pixel buffer in memory.

3. Re-encode — canvas.toBlob(mimeType, quality) re-encodes the pixel buffer into the target format using the browser's built-in encoder. The quality parameter (0.0–1.0) controls lossy compression for JPEG and WebP.

This mechanism means the conversion quality is determined entirely by the browser's encoder — different browsers may produce slightly different file sizes at the same nominal quality setting.

Browser support matrix

| Format | Decode | Encode (Canvas) | |--------|--------|-----------------| | PNG | All browsers | All browsers | | JPEG | All browsers | All browsers | | WebP | Chrome 32+, Firefox 65+, Safari 14+ | Chrome, Firefox, Safari 14+ | | AVIF | Chrome 85+, Firefox 93+, Safari 16+ | Not supported (2026) | | GIF | All browsers | Not via Canvas | | SVG | All browsers | Not via Canvas (rasterises) |

Quality slider

The quality slider (0.1–1.0) applies only to lossy output formats: JPEG and WebP lossy. For PNG output, quality has no effect — PNG is always lossless. Practical guidance:

• 0.9–1.0 — near-lossless, large files, appropriate for source assets or print
• 0.75–0.85 — the sweet spot for web delivery, visually indistinguishable from original for most photographs
• 0.5–0.7 — visibly compressed, appropriate for thumbnails or bandwidth-constrained delivery
• Below 0.5 — heavy artifacts, suitable only for previews or low-bandwidth fallbacks

Why no SVG or GIF output?

SVG is a vector format — it stores mathematical shape descriptions, not pixels. The Canvas API rasterises SVG input to a pixel grid when you draw it, discarding all vector data. Converting the resulting bitmap back to "SVG" would produce an SVG file containing a raster image — larger and no longer scalable. There is no path from raster to SVG without an AI vectoriser.

GIF output is not exposed by canvas.toBlob() in any browser. GIF is limited to 256 colours and supports animation — neither property is accessible through the Canvas encode path. For animated GIFs, use a dedicated tool.

Privacy

This tool runs entirely in your browser. Your images are decoded and re-encoded locally using the browser's Canvas API. No pixel data, file content, or metadata is transmitted to any server. The tool works offline once the page is loaded.

Related tools

• Base64 Encode/Decode — encode a converted image as a Base64 data URI for inlining in CSS or HTML.
• SVG optimiser — reduce SVG file size while keeping it as a vector format.

Why can't I export to AVIF if my browser supports it?

AVIF decoding (reading) is supported in Chrome 85+, Firefox 93+, and Safari 16+, but AVIF encoding via the Canvas API (canvas.toBlob('image/avif')) is not implemented in any browser as of 2026. Encoding AVIF requires the computationally expensive AV1 encoder, which browsers have not yet exposed through the Canvas API. You can convert AVIF input to PNG, JPEG, or WebP — just not the other direction. For AVIF encoding, use a server-side tool like libavif, sharp, or Squoosh's CLI.

My transparent PNG turned white after converting to JPEG. Is that a bug?

No — JPEG does not support an alpha channel. When the Canvas draws your transparent PNG and then encodes to JPEG, transparent pixels are composited over the default white Canvas background. To preserve transparency, convert to PNG (lossless, full alpha) or WebP (supports alpha in both lossy and lossless modes). If you need JPEG but want a specific background colour, consider adding a background fill step in an image editor first.

What quality setting should I use for web images?

For photographs: 0.80–0.85 in JPEG or WebP produces files that are visually indistinguishable from the original to most viewers at 5–10× smaller than PNG. For images with text, sharp lines, or UI elements, use PNG (lossless) instead of adjusting quality — lossy compression creates visible block artifacts on sharp edges regardless of the quality value. WebP at 0.85 is a good default for modern web delivery.

Why does my 10 MB file get rejected?

The 10 MB limit is on the input file size. Large images decoded into raw RGBA pixel data can be much larger in memory — a 10 MB JPEG may expand to 50–100 MB as a raw pixel buffer in the Canvas. Exceeding available browser memory causes the tab to crash or the conversion to fail silently. If you need to convert larger files, use a server-side tool like ImageMagick, sharp (Node.js), or PIL/Pillow (Python).

How much smaller will my image be after converting to WebP?

It depends on the source content and quality setting. Typical results: lossy WebP at quality 0.80 produces files 25–34% smaller than equivalent-quality JPEG, and WebP lossless is about 26% smaller than PNG. Results vary — photographs compress better than diagrams, and images with large uniform regions may see smaller gains. Converting JPEG to WebP at the same quality will almost always yield a smaller file; converting PNG to WebP lossless yields moderate savings.

Does converting JPEG to PNG make my image lossless?

No. PNG is a lossless format, but converting a JPEG to PNG does not recover the detail already discarded by JPEG compression. The conversion captures the current degraded pixel values losslessly — it does not reverse the original lossy compression. The result is a larger file with no quality improvement. Only use JPEG→PNG when you need alpha channel support or need to make further edits without introducing additional JPEG re-compression artifacts.

Can I convert GIF or SVG files?

GIF input decodes in the browser (animated GIFs are flattened to the first frame), and the resulting pixels can be exported to PNG, JPEG, or WebP. SVG input is also rasterised to pixels at its natural size when drawn to the Canvas. Neither GIF animation nor SVG vector data survives the conversion — the output is always a static raster image. GIF and SVG output are not available because the Canvas API does not expose encoders for them.

Is my image sent to a server at any point?

No. The entire conversion pipeline — file reading, decoding, Canvas drawing, and re-encoding — runs in your browser. No pixel data, EXIF metadata, or file content is transmitted over the network. You can verify this by opening your browser's network tab while converting; you will see zero requests. The tool works offline once the page has loaded.