Guide
Encoding your own images as AVIF for faster pages
Images are usually the heaviest part of a web page, and AVIF is currently the most efficient format browsers can display. Re-encoding a site’s JPGs as AVIF commonly removes a large share of their weight without a visible change, which helps loading speed and Core Web Vitals. This tool encodes your images with libavif, the reference AVIF library, right in the browser.
What AVIF does better
AVIF is built on AV1, a video codec designed to keep detail at low bitrates. Smooth gradients such as skies stay free of the blocky banding JPEG produces at small sizes, and fine texture survives more aggressive compression. It also supports transparency, so a PNG logo can become an AVIF without losing its see-through background, and wide color ranges, although this tool writes standard 8-bit sRGB pictures.
Choosing a quality
The slider runs from 30 to 100 percent; 60 percent is a good starting point for photographs. Look at the result at full size, especially in skin, foliage and sky. If you see smearing, go up in steps of five; if it looks identical to the original, try going down. Graphics with text need higher settings, 75 to 90 percent, because AVIF’s smoothing is most visible on hard edges. Each row reports the size before and after so you can compare quickly.
Why it takes a few seconds
AVIF encoders try many ways to split and predict each block of the image and keep the cheapest. That search is what makes the files small, and it is expensive. Here the encoder runs on one core of your processor, at a speed setting that balances time against size. Converting a batch of large photos can take a few minutes; the page stays usable while it works, and decoding AVIF later is fast for visitors.
Transparency and color
Transparent PNG and WebP images keep their alpha channel in the AVIF. Photos from phones in HEIC format are decoded first and then encoded, so you can go directly from an iPhone picture to AVIF. Metadata such as the camera model and GPS location is not written into the new file.
Deploying AVIF on a website
Serve AVIF to browsers that accept it and keep a fallback for the rest, typically with a picture element listing an AVIF source and a JPG or WebP image. Many CMSs and image CDNs can do this automatically once you upload the AVIF variants. Test pages on a slow connection to confirm the gain.
Comparing with WebP
WebP encodes faster and is supported for longer, so it remains a solid default. JPG to WebP and PNG to WebP are quick alternatives when encoding time matters. To check a whole batch’s savings with plain size limits instead, the Compress Image tool works with JPG, PNG and WebP. And if you receive AVIF files you cannot open, AVIF to JPG converts them back.
A test before converting a whole site
Pick five typical images: a portrait, a landscape with sky, a product shot on white, a screenshot with text and a logo. Encode them at 50, 60 and 70 percent and compare each against its original at full size, side by side. Note the lowest setting where you cannot tell them apart, per type of image; photos usually tolerate lower settings than screenshots. Then convert the rest of the batch with those values. This small experiment gives you better results than any rule of thumb, because the right setting depends on how much detail and noise your particular pictures contain.
Checked against the current version of the Image to AVIF on .

