JPG to AVIF: Complete Conversion Guide for Web Performance

By Bill Crawford  ·  March 2026  ·  9 min read  ·  Last updated March 8, 2026

Connect on LinkedIn →

What Is the AVIF Format?

AVIF (AV1 Image File Format) is a modern image format derived from the AV1 video codec, developed by the Alliance for Open Media. It was designed from the ground up to surpass the compression efficiency of older formats like JPG and even the more recent WebP. The core promise of AVIF is straightforward: the same visual quality at dramatically smaller file sizes.

Where JPG uses Discrete Cosine Transform (DCT) compression — a technique dating to 1992 — AVIF uses the AV1 codec's inter-frame prediction, variable transform block sizes, and advanced entropy coding. The result is compression that extracts far more redundancy from image data, especially in photos with smooth gradients, skies, and skin tones where JPG's block artifacts are most noticeable.

JPG: The Universal Standard

JPG (also written JPEG) has been the dominant web image format since the mid-1990s. Its near-universal browser support, hardware decode acceleration on virtually every device, and well-established toolchain make it the safe default for photographic content. Every web browser, email client, image editor, and operating system handles JPG without issue.

The limitation is efficiency. JPG's DCT-based compression creates characteristic 8×8 pixel block artifacts at high compression ratios. It does not support transparency (alpha channel), HDR color, or color spaces beyond sRGB. And its compression efficiency, while excellent for 1992 technology, has been surpassed multiple times in the three decades since.

Why Convert JPG to AVIF?

The primary reason is file size reduction. A well-compressed AVIF at quality 80 typically matches the visual fidelity of a JPG at quality 85–90, while producing a file 40–60% smaller. For a website serving thousands of images, this translates directly to:

• Faster page load times. Smaller images transfer faster over any connection. For mobile users on 4G or slower connections, the difference can be substantial.
• Better Core Web Vitals scores. Google's Largest Contentful Paint (LCP) metric is heavily influenced by how quickly hero images load. Switching from JPG to AVIF can meaningfully improve LCP for image-heavy pages.
• Reduced bandwidth and hosting costs. Image delivery is often the largest component of website traffic. Reducing image sizes by 50% cuts those costs proportionally.
• Transparency support. AVIF supports full RGBA transparency. Images that previously required PNG (for transparency) can often be converted to AVIF for a smaller, more efficient alternative.

JPG vs AVIF: Format Comparison

When Should You Convert JPG to AVIF?

The best candidates for JPG-to-AVIF conversion are:

• Hero images and product photos on websites. These are the images that most affect Core Web Vitals and are viewed in browsers that support AVIF. Converting these to AVIF with a JPG fallback delivers the maximum performance benefit.
• Blog post and article images. Long-form content pages often contain many embedded photos. Converting these to AVIF reduces total page weight significantly.
• E-commerce product galleries. Online stores frequently serve hundreds of product images per page view. AVIF conversion reduces bandwidth for both the site operator and the end user.
• Photo portfolio websites. High-quality photos in AVIF can match the visual fidelity of large JPGs at a fraction of the file size, enabling faster full-page gallery loads.

Understanding Quality Settings

The quality slider in the JPG to AVIF converter controls how aggressively the AV1 encoder compresses the image. The scale runs from 1 (maximum compression, lowest quality) to 100 (minimum compression, highest quality).

Practical guidance by use case:

• Quality 85–90: Recommended default. Visual quality is essentially indistinguishable from the source JPG for typical display sizes. Good balance of file size reduction and fidelity.
• Quality 70–80: Suitable for thumbnails, social media previews, and secondary images where slightly reduced fidelity is acceptable for better compression.
• Quality 90–95: For critical product imagery, portfolio photos, or any context where maximum detail preservation is required.
• Quality below 60: Visible compression artifacts become noticeable. Useful only for very small thumbnails or non-critical decorative images.

Note that because JPG is already a lossy format, converting JPG to AVIF involves re-encoding already-compressed data. Setting the AVIF quality too low can amplify existing JPG artifacts. When working from JPG originals (rather than raw or PNG source files), use a slightly higher quality setting than you might with a lossless source.

Browser Support for AVIF

AVIF display support has reached broad coverage in modern browsers:

• Chrome 85+ — Full decode and encode support (released August 2020)
• Edge 85+ — Full decode and encode support (Chromium-based)
• Firefox 93+ — Full decode and encode support (released October 2021)
• Safari 16.4+ — Decode support added (released March 2023); canvas encode support varies
• iOS Safari 16.4+ — Decode support; canvas encode support varies by device
• Internet Explorer — No support (end-of-life)

For encoding in this browser tool specifically, Chrome and Edge provide the most reliable results. If you encounter conversion failures, switch to Chrome or Edge.

Serving AVIF with JPG Fallback

Because AVIF is not universally supported, the recommended pattern for production websites is to use HTML's <picture> element to serve AVIF to capable browsers and fall back to JPG for older ones:

<picture>
  <source srcset="image.avif" type="image/avif">
  <img src="image.jpg" alt="Description" width="800" height="600">
</picture>

Browsers that understand AVIF will request image.avif; all others will fall back to image.jpg. This approach requires maintaining two versions of each image but provides both the performance benefit and complete backward compatibility.

Many modern CDNs and image optimization services (Cloudflare Images, Imgix, Cloudinary) can serve AVIF automatically based on Accept headers, eliminating the need to maintain two files.

When Not to Convert JPG to AVIF

AVIF is not always the right choice:

• Email clients. Most email clients, including Gmail and Outlook, do not render AVIF. For email campaigns, stick with JPG or PNG.
• Legacy system integrations. If images are consumed by APIs, CMS systems, or partner platforms with strict format requirements, verify AVIF support before converting.
• When encoding speed matters. AVIF encoding is significantly slower than JPG — 3–10× slower depending on image size and browser. For real-time image processing pipelines, this may be a constraint.
• Images with existing JPG artifacts. Very low-quality JPGs with heavy block artifacts can see those artifacts amplified when re-encoded to AVIF at lower quality settings. Use high quality (85+) when working from already-compressed sources.

Starting From the Best Source

Whenever possible, convert to AVIF from the original uncompressed or lossless source — RAW, TIFF, or PNG — rather than from a JPG that has already been compressed. Converting from a lossless source to AVIF allows the AV1 encoder to work with the full original data, producing better results at any given quality level. Converting from JPG to AVIF processes data that has already been degraded by JPG compression, and any artifacts from the JPG stage are baked in before AVIF encoding begins.

If JPG is the only source available — for example, when working with an existing image library — use a quality setting of 85 or higher to minimize any additional quality loss from the re-encoding step.

Frequently Asked Questions