Convert images to AVIF/AVIFS with open-source tools

🇹🇼 中文版

Commands for converting images or videos to AVIF/AVIFS。

Here is a avif animated AVIF. Only 700kb. It should playing well on Chromium.

Why AVIF? Because it has same size as JPEG but higher quality. Also AVIF supports animated pictures (the file extesnion is avif or avifs). The qaulity is better than GIF and the size is smaller than webp.

It is easy to convert jpeg, png, gif or whatever to avif with these commmand line tools!

1. Tools used

OS:Arch Linux

All tools below are open-source and cross-platform. On Arch Linux they can be installed with pacman.

NameDescriptionLink
libavifAVIF libraryGithub
rav1eAV1 encoderGithub
aomAV1 encoderGoogle git
imagemagickImage processing toolOfficial
ffmpegEncoding toolOfficial
gpacEncoding toolGithub
av1anEncoding toolGithub

2. Convert GIF to AVIF

Ref.

Convert GIF to yuv and pass it to avifenc to transcode to avif.

1
ffmpeg -i input.gif -strict -1 -f yuv4mpegpipe -pix_fmt yuva444p - | avifenc --stdin  output.avif

3. Convert JPEF/PNG to AVIF

Convet jpeg to avif:

1
magick convert input.jpeg -quality 90% output.avif

Convet png to avif:

1
magick convert input.png -quality 50% output.avif

Batch convert png to avif:

1
magick mogrify -format avif -quality 90 -type truecolor -alpha on *.png

4. Convert WebP to AVIF

After converting, the size is almost the same so it is a little bit meaningless.

1
magick convert input.webp -quality 50% output.avif

5. Convert WebP (animated) to AVIF

There is no tool for directly convery animated webp to avif.

  1. Extract frames from webp:
1
magick convert input.webp -coalesce input%05d.png
  1. Create a mp4 file from extracted images and use libxaom for encoding.
1
ffmpeg -framerate 30 -pattern_type glob -i '*.png' -c:v libxaom -pix_fmt yuv420p output.mp4
  1. Convert mp4 file to avif:
1
2
3
MP4Box -add-image output.mp4:id=1:primary -new output.avifs
MP4Box -ab avis -ab msf1 -ab miaf -ab MA1B -rb mif1 -brand avis output.avifs
MP4Box -add output.mp4:hdlr=pict:ccst:name="GPAC avifs" output.avifs

6. Convert MP4/WebM videos to animated AVIF

Ref.

  1. Make sure the video coding format is AV1. If not, convert the coding format to av1 codec with av1an (increase --cq-lelve for a smaller video):
1
av1an -i "input.mp4" -v "--end-usage=q --cpu-used=6 --threads=8 --cq-level=30"
  1. Convert mkv to mp4 and delete audio tracks
1
ffmpeg -i input_aom.mkv -c copy -an output.mp4
  1. Convert mp4 file to avif:
1
2
3
MP4Box -add-image output.mp4:id=1:primary -new output.avifs
MP4Box -ab avis -ab msf1 -ab miaf -ab MA1B -rb mif1 -brand avis output.avifs
MP4Box -add output.mp4:hdlr=pict:ccst:name="GPAC avifs" output.avifs

7. Convert AVIF to JPEG/PNG

AVIF to JPEG:

1
magick convert input.avif -quality 90% output.jpeg

AVIF to PNG:

1
magick convert input.avif -quality 90% output.png

Thanks for your reading. You are welcome to share articles of Ivon's Blog (ivonblog.com). Please include the original URL when reprinting or citing articles, and abide by CC BY-NC-ND 4.0 license. For commercial use, please write an e-mail to me.

written by human, not by AI

If this article is helpful to you please consider supporting me.

Leave a comment

Choose the commenting system you like. Giscus for codes, Disqus for anonymous comments.

Please login to your Github account to leave a comment. You can post codes here for discussion. For images, please upload to Imgur and copy links. Your comments would be visible to everyone on Github Discussions.

This comment system is provided by Disqus, you may see some Disqus ADs on this page. You can leave a comment anonymously but you won't receive reply notifications.