Convert AVIF to JPG: a quick guide for developers (browser + CLI)

AVIF is one of the best things to happen to web image delivery in years. It routinely cuts a photo to about half the bytes of an equivalent JPG, which is a real Largest Contentful Paint win. So you serve AVIF. Then someone on the team opens the asset in an older tool, or a CMS upload field rejects it, or a teammate on an older OS cannot preview it, and you need a plain JPG after all.

Here are two fast ways to convert AVIF to JPG: a zero-setup browser tool for one-offs, and an ImageMagick one-liner when you need to batch a folder.

Why AVIF needs a JPG fallback at all

AVIF decoding landed in Chrome 85, Firefox 93, and Safari 16, and it now covers over 90 percent of browsers. That is plenty for <picture> with a fallback, but outside the browser the support picture is patchier: plenty of desktop viewers, email clients, and upload forms still do not read .avif. JPG has worked everywhere for decades. The pragmatic pattern is to store and serve AVIF, and hand out a JPG copy whenever an asset leaves your pipeline.

The browser way (one-off, nothing uploaded)

For a single file, the fastest path is the Pixellize AVIF to JPG converter. It runs entirely client side with the Canvas API, so the image never touches a server.

1. Drop the AVIF in

2. Pick a quality and convert

3. Save the JPG

The CLI way (batch a whole folder)

When you have a directory of AVIFs, ImageMagick is the tool. One file:

magick input.avif output.jpg

A whole folder, at quality 90:

for f in *.avif; do
  magick "$f" -quality 90 "${f%.avif}.jpg"
done

If your build uses sharp in Node, it is a two-liner:

const sharp = require("sharp");
await sharp("input.avif").jpeg({ quality: 90 }).toFile("output.jpg");

A note on size and quality

Do not expect the JPG to be smaller. AVIF is the more efficient codec, so the JPG almost always comes out larger for the same perceived quality. In a quick test, a 78 KB AVIF became a 123 KB JPG at high quality. Both formats are lossy, so there is a small quality cost on top, though at quality 90 it is hard to spot on a photo.

The transparency gotcha

JPG has no alpha channel. If your AVIF has a transparent background, a JPG conversion flattens it to a solid color. For logos, icons, or any cutout, convert to PNG instead. Reserve JPG for photographs and images with no transparency.

That is the whole workflow: keep AVIF for delivery, reach for the browser converter for a quick one-off, and script ImageMagick when you need a batch.