How to convert PNG to WebP online (and when to use AVIF instead)

WebP is the format you should be using for most web images in 2026. It is 25–40% smaller than PNG or JPEG at equivalent quality, it supports transparency (unlike JPEG), it supports animation (unlike PNG), and every major browser and operating system has supported it for years. If you are still serving PNG files on a website, you are leaving a significant page speed improvement on the table.

This guide covers three ways to convert PNG to WebP — in the browser, on the command line, and via an API — along with file size benchmarks, a comparison with AVIF, and guidance on which format to choose for each type of image.

Why WebP is smaller than PNG

PNG uses lossless compression: every pixel is preserved exactly as it was in the source. This makes PNG the right choice for screenshots, UI elements, logos, and any image that must be pixel-perfect. But "lossless" means large. A typical photograph saved as PNG is 2–10× larger than the same photograph saved as a high-quality JPEG, and 3–15× larger than a WebP at equivalent perceived quality.

WebP uses a prediction model borrowed from the VP8 video codec. Instead of storing each pixel independently, WebP stores how each pixel differs from a prediction based on neighbouring pixels. For typical images, this dramatically reduces the data needed. WebP also supports both lossy and lossless modes — lossy WebP competes with JPEG, lossless WebP competes with PNG.

Method 1: convert PNG to WebP in the browser

The fastest way to convert a PNG to WebP is quickhelp.dev's Image Converter. It runs entirely in your browser using the Canvas API — your image is never uploaded to a server.

1. Open /image-converter.
2. Drag your PNG file onto the converter (or click to browse). Multiple files are supported — they download as a ZIP.
3. Select WebP as the output format.
4. Adjust quality if needed (default: 80, which is a good starting point for photographs).
5. Click Convert. The WebP file downloads automatically.

You can also convert directly from a specific format pair — for example, /convert/png-to-webp pre-selects PNG → WebP so you skip the format picker. Similarly, /convert/png-to-avif handles the PNG → AVIF path.

Method 2: convert PNG to WebP on the command line

For batch conversion or CI pipelines, cwebp (from the libwebp package) is the standard tool.

# Install on macOS
brew install webp

# Install on Ubuntu/Debian
apt-get install webp

# Convert a single file (quality 80)
cwebp -q 80 input.png -o output.webp

# Batch convert all PNGs in a directory
for f in *.png; do cwebp -q 80 "$f" -o "${f%.png}.webp"; done

For lossless WebP (closest to PNG quality, but still smaller for many images):

cwebp -lossless input.png -o output.webp

Method 3: convert via API

The quickhelp.dev API accepts Base64-encoded image data and returns the converted file as Base64. This is useful for server-side or CI conversion without installing native binaries.

# Encode PNG to Base64, convert to WebP, decode result
B64=$(base64 -i input.png)
RESULT=$(curl -s -X POST https://quickhelp.dev/api/image-converter \
  -H 'Content-Type: application/json' \
  -d '{"image":"'"$B64"'","from":"png","to":"webp","quality":80}')

echo $RESULT | jq -r '.image' | base64 --decode > output.webp

See the OpenAPI spec or API docs for the full schema.

Quality settings: what 80 means

WebP quality is a 0–100 scale. Unlike JPEG (where 100 is lossless but huge, and 60–75 is typical), WebP's quality scale is calibrated differently:

• Quality 80–85: the standard recommendation for photographs. Visually indistinguishable from lossless for most images.
• Quality 90–95: for images where quality is critical (product photography, medical images). 10–20% larger than q80.
• Quality 60–75: for thumbnails, previews, or any image that will be displayed at a small size.
• Lossless: for logos, screenshots, and images with text. Usually still smaller than PNG, never degrades quality.

When to use AVIF instead of WebP

AVIF (AV1 Image File Format) achieves better compression than WebP — typically 15–30% smaller at the same perceptual quality. As of 2026, AVIF is supported by Chrome, Firefox, and Safari (since Safari 16.4), meaning it covers the vast majority of browsers worldwide.

Use AVIF when:

• You control the server and can serve AVIF with a fallback (<picture> with a WebP or JPEG source).
• File size is critical — high-traffic pages where every KB saved reduces bandwidth costs.
• You need the best possible quality at a given file size (AVIF wins at equal SSIM scores).

Stick with WebP when:

• You need broad compatibility without conditional serving (e.g., direct download links, email, social media uploads).
• Encoding speed matters — AVIF encoding is significantly slower than WebP, especially for large or complex images.
• You are converting GIF animations (WebP supports animation; AVIF animation support is less mature).

For most websites, the pragmatic answer is: convert everything to WebP now, and add AVIF as a first-choice option in your <picture> elements as your build pipeline allows.

A note on transparency

If your PNG has a transparent background (alpha channel), WebP preserves it correctly. JPEG does not support transparency at all — converting a transparent PNG to JPEG will replace the transparency with a solid background (usually black or white). When transparency matters, use WebP, AVIF, or PNG; never JPEG.

You can use quickhelp.dev's Background Remover to create a transparent PNG from a photo, then convert that to WebP for web use.

Common pitfalls

• Re-converting a lossy file: converting JPEG → WebP does not recover quality lost during the original JPEG compression. Always convert from the original lossless source (PNG or RAW) if you have it.
• Over-compressing product images: below quality 70, WebP compression artefacts become visible at sharp edges (e.g., text in images, logos). Use lossless WebP for anything with text or fine detail.
• Not using <picture>: if you are changing file extensions on a live site, make sure old PNG URLs still work or update all references. The <picture> element lets you serve WebP to modern browsers and PNG as a fallback without breaking anything.

Try it now

Convert your PNG files to WebP for free at quickhelp.dev/convert/png-to-webp. No upload to a server, no account, no watermark on images. For PNG → AVIF, go to /convert/png-to-avif. Both converters also support batch conversion — drag multiple files and download a ZIP.