FormatDrop
How-To Guide

How to Convert PNG to AVIF

AVIF achieves dramatically smaller file sizes than PNG for photographic content — 50-60% smaller than JPG at equivalent quality. For web images with photos or complex graphics, converting PNG to AVIF with JPG/PNG fallback is one of the most impactful performance optimizations. This guide covers free conversion tools and how to implement AVIF on your website.

Step-by-step instructions

  1. 1

    Method 1: Browser converter

    Go to formatdrop.com → Image Converter. Drop your PNG. Select AVIF output. Set quality (50-70 is typically good for photos; higher for detailed images). Download. The conversion runs in your browser.

    Go to converter
  2. 2

    Method 2: Squoosh (Google's free image optimizer)

    Go to squoosh.app in Chrome. Drop your PNG. On the right side, select 'AVIF' as the output format. Adjust quality slider while comparing with the original. Download the optimized AVIF. Squoosh shows file sizes and quality comparisons side-by-side — excellent for finding the right quality setting.

  3. 3

    Method 3: avifenc (reference encoder)

    Install libavif tools (Mac: brew install libavif; Ubuntu: apt install libavif-apps). Convert: avifenc --quality 60 --speed 6 input.png output.avif. Quality range: 0-63 (lower = higher quality). Speed: 0 (slowest, best quality) to 10 (fastest). For web use: quality 50-65, speed 6.

  4. 4

    Implement with <picture> for fallback

    <picture><source srcset='image.avif' type='image/avif'><source srcset='image.webp' type='image/webp'><img src='image.jpg' alt='description'></picture>. This serves AVIF to 94%+ of users, WebP to the rest, with JPG as the universal fallback.

Why convert PNG to AVIF?

PNG is lossless — it stores every pixel perfectly. For photographic content on websites, lossless is overkill and creates unnecessarily large files. A photographic PNG might be 2MB; the same image as AVIF at equivalent visual quality is 200KB. Converting to AVIF can reduce image bandwidth by 80-90% for photographic content. For images with transparency: AVIF lossless mode achieves 26% smaller files than lossless PNG.

Your files never leave your device

FormatDrop runs the conversion engine entirely inside your browser using WebAssembly. No file upload. No server. Nothing stored. You can verify this by opening DevTools → Network tab and watching: zero upload requests.

Frequently asked questions

Should I use lossy or lossless AVIF?
For photos: lossy AVIF at quality 50-65 produces files 80-90% smaller than PNG with no visible quality difference at web display sizes. For PNG images with transparency (logos, icons, UI elements): try AVIF lossless mode — it's 26% smaller than PNG with zero quality loss. For screenshots with text: AVIF lossless or WebP lossless are better than lossy AVIF (compression artifacts on text look bad).
Is AVIF better than WebP for web images?
For photographic content: yes, AVIF achieves 20-30% better compression than WebP at equal quality. For logos and vector-style images: WebP and AVIF are comparable. For practical use: AVIF has 94% browser support vs WebP's 97% — both are acceptable for modern web. Use AVIF as the first <source> and WebP as fallback for maximum coverage with optimal compression.
Convert PNG to AVIF Now — Free

No account. No upload. Works in any browser.