The deciding fact is that AVIF carries two compression modes while PNG carries one. PNG is lossless only. AVIF offers both lossy and lossless paths, which makes the comparison two separate contests rather than one. Pick the wrong mode and AVIF can lose to PNG it should have beaten.
This page goes past the spec table above: it weighs AVIF lossy against PNG, AVIF lossless against PNG, alpha quality on both, and the narrow set of jobs where PNG is still the right default.
Convert between the two in your browser, with no upload: Convert PNG to AVIF and Convert AVIF to PNG.
The two contests, not one
AVIF vs PNG splits into two decisions. Choose the contest by whether the image can tolerate any pixel change.
- Photographic or photo-like content — run the AVIF lossy contest. Here AVIF wins by 10–40×.
- Pixel-exact graphics, line art, UI assets — run the AVIF lossless contest. Here the margin is small and PNG sometimes wins.
PNG always plays lossless because PNG has no lossy mode. Its DEFLATE pipeline is the same algorithm as ZIP, so a PNG is bit-identical to its source. AVIF, derived from the AV1 video codec, can either discard imperceptible detail (lossy) or preserve every pixel (lossless). The Lossy vs Lossless Compression guide explains how to predict which mode a given image needs.
AVIF lossy vs PNG: the landslide
For any image with photographic content, AVIF lossy is 10–40× smaller than PNG. A 2000×1500 photo stored as PNG runs roughly 8 MB; the same image as AVIF at quality 80 is often under 200 KB (avif.expert).
This case matters more than it sounds. Teams store images as PNG for reasons that have nothing to do with needing lossless fidelity:
- Screenshots with photographic regions — a dashboard over a hero photo compresses terribly as PNG.
- Product cutouts on transparent backgrounds — PNG was the only old format with both photo content and alpha.
- Marketing exports — design tools default to PNG, so photos ship as multi-megabyte files.
All three are PNG only by accident. Re-encoding them as AVIF lossy, with a lossless alpha channel where transparency exists, removes the bytes PNG was never able to compress. For images without transparency, see AVIF vs JPG, which covers the same photographic territory.
AVIF lossless vs PNG: the close contest
When both formats run lossless, AVIF usually wins on photographic content and PNG often wins on flat graphics. The result is content-dependent, not absolute.
| Content type | Who wins lossless | Why |
|---|---|---|
| Photographs, gradients, noise | AVIF | Wider transform set models continuous tone better |
| Detailed textures | AVIF, narrowly | AVIF's prediction beats DEFLATE on complex detail |
| Flat-colour logos, few colours | Often PNG | PNG's palette plus filtering is already near-optimal |
| Line art, sharp text | Often PNG | DEFLATE excels on long runs of identical pixels |
| Tiny images (under ~64 px) | PNG | AVIF's ISOBMFF container overhead dominates |
Published lossless benchmarks land on different headline numbers because they test different image sets. One comparison finds lossless AVIF roughly 50–60% smaller than PNG on photographic input (avif.expert). Another, weighting text and line art heavily, reports PNG averaging ~3.9× smaller than AVIF (siipo.la). Both are correct for their corpus. The lesson: test your own assets rather than trusting a single benchmark.
Alpha transparency: a near-tie with one caveat
Both formats support full 8-bit alpha, so flat transparency looks identical. AVIF matches PNG on alpha quality and beats it on alpha size.
- Bit depth — PNG tops out at 8-bit alpha; AVIF supports 8-, 10-, and 12-bit alpha.
- Compression — AVIF stores the alpha plane as a separate AV1 layer, compressing it independently from colour.
- Mixed images — AVIF can pair a lossy colour plane with a lossless alpha plane, which PNG cannot express.
That last point is the practical win. A product cutout needs a clean lossless edge but tolerates lossy colour. AVIF encodes exactly that combination; PNG must store the whole image losslessly. The AVIF format overview details the alpha pipeline.
When PNG is still the correct choice
Keep PNG when the job needs guarantees AVIF cannot offer in every channel. PNG remains correct for pixel-exact assets, universal reach, and source masters.
- Pixel-exact UI assets — icons and sprites that must render byte-for-byte across devices.
- Tiny icons and favicons — under ~64 px, AVIF's container overhead can exceed the payload; keep PNG.
- Universal, lossless integrity — email clients, RSS readers, screenshot galleries, and embedded viewers that may not decode AVIF.
- Source masters — keep a lossless original and export AVIF on demand; never treat a lossy AVIF as your archive.
- Pure vector artwork — neither raster format applies; ship SVG, which stays sharp at any scale.
Encoding speed also favours PNG in a build pipeline. Lossless AVIF encoding is markedly slower than writing a PNG, so high-volume lossless batch jobs pay a real time cost.
Browser support in 2026
PNG support is total. AVIF reaches ~94% of global users, PNG reaches effectively 100%.
- PNG — every browser ever shipped decodes it.
- AVIF — Chrome and Edge since v85 (2020), Firefox since v93 (2021), Safari since v16 / iOS 16 (2022), per caniuse.
The ~6% AVIF gap is iOS 15-and-older, locked-down corporate Windows, and some in-app browsers. A <picture> element with a PNG fallback covers that tail automatically. The AVIF Browser Support guide details the fallback patterns.
Recommendations by asset type
Match the format to the asset, not to a blanket rule. Default to AVIF for delivery, keep PNG for masters and edge cases.
- Screenshots — AVIF lossy if they contain photos or gradients; PNG or AVIF lossless if pure flat UI.
- Logos with transparency — try both lossless; ship whichever is smaller, with a PNG fallback.
- Photographic PNGs — convert to AVIF lossy now; this is the largest single win. Use Convert PNG to AVIF.
- Diagrams and line art — keep PNG, or compare lossless AVIF on the exact file before switching.
- Tiny icons — keep PNG; AVIF overhead wipes out the saving.
For the encoder parameters behind these calls, see AVIF Compression Settings and the broader AVIF Optimization walkthrough.
How to ship AVIF with a PNG fallback
Serve AVIF first and let the browser fall back to PNG. The <picture> element handles negotiation with no JavaScript.
<picture>
<source type="image/avif" srcset="/logo.avif" />
<img src="/logo.png" alt="Company logo" width="240" height="80" decoding="async" />
</picture>
Browsers that decode AVIF use the first <source>; the rest fall back to the <img> PNG. Always set width and height to prevent layout shift. For non-web distribution, attach the PNG, since PNG opens everywhere.
FAQ
Is lossless AVIF always smaller than PNG?
No. Lossless AVIF usually wins on photographic content and loses on flat graphics and tiny images. PNG's DEFLATE pipeline is already efficient on long runs of identical pixels, such as line art and sharp text. Test the specific file before committing to either.
Does converting PNG to AVIF lose transparency?
No. AVIF preserves the full alpha channel. AVIF supports 8-, 10-, and 12-bit alpha, so a transparent PNG converts to a transparent AVIF with no loss of the mask. Use Convert PNG to AVIF to keep transparency in-browser.
Should PNG stay my source master?
Yes, when the source is lossless. Keep a lossless master and export AVIF for delivery. A lossy AVIF discards detail permanently, so re-encoding from it compounds loss. Store PNG (or another lossless format) as the archive and generate AVIF on demand.
Convert your images
These converters run entirely in your browser — the image never leaves your device:
- Convert PNG to AVIF — shrink a photographic or transparent PNG
- Convert AVIF to PNG — recover a PNG for tools that need it
Sources and further reading
- AVIF support tables — caniuse
- AVIF lossless vs lossy compression — avif.expert
- Best lossless image format compared — siipo.la
- PNG format overview — PNG's compression pipeline and alpha support
- AVIF format overview — the central format and its alpha pipeline
- Lossy vs Lossless Compression — choosing a mode