AVIF to JPG
When a system accepts only JPEG — and many upload forms, CMS installations and print services still do — this is the conversion that unblocks you. Transparency is flattened and a second lossy encode is applied, so use a high quality setting and keep the AVIF as your master copy.
What Each Format Is For
AVIF. AVIF, built on the AV1 video codec, compresses harder than WebP — often 20–30% smaller again at the same quality — with alpha, wide colour gamut and HDR. Encoding is slow and browser support, while now broad, is younger than WebP’s.
JPG. JPG is lossy and has no transparency at all. Its discrete-cosine compression is built for photographs — smooth gradients, natural detail — and visibly degrades sharp edges and text into ringing artefacts. Every save re-encodes and loses a little more, so JPG is a delivery format, not a working one.
| AVIF | JPG | |
|---|---|---|
| Compression | Lossless | Lossy |
| Transparency | Yes | No |
Transparency Will Be Lost
AVIF carries an alpha channel and JPG does not. Transparent pixels are composited onto a solid background during conversion — white here — which is visible the moment the image sits on any other colour. If the image is a logo destined for a coloured page, converting to JPG is the wrong move; keep the alpha and use PNG or WebP.
The Conversion Runs in Your Browser
The file is decoded and re-encoded locally through a canvas. Nothing is uploaded, nothing is stored, and the conversion works with the network disconnected. For anything containing personal data — identity documents, medical images, private photographs — that is a meaningfully different risk profile from any server-side converter.
The practical limits are your device's memory on very large images, and the browser's own codec support: it can only encode formats it ships an encoder for, and the tool tells you when it cannot.
Quality Settings
JPG is lossy, so the quality slider is a real decision. 80–85 is indistinguishable from the original for most photographs at normal viewing sizes; below 70 artefacts appear around edges. Convert from the highest-quality source you have, never from an already-compressed copy — losses compound.
One-Way Doors
Re-encoding never recovers information. If the target is lossy, keep the original: a JPG converted back to AVIF has the same artefacts as the JPG, in a larger file. Treat converted output as a delivery copy and archive the source.
Sizing Before Compressing
Resizing beats compressing. Halving an image's dimensions removes 75% of its pixels, which no quality setting can match, and a 4000px photo displayed at 800px is wasting 96% of what it downloads.
| Displayed at | Serve (1×) | Serve (2× for retina) |
|---|---|---|
| 400px | 400px | 800px |
| 800px | 800px | 1600px |
| 1200px | 1200px | 2400px |
Quality Settings That Hold Up
| Setting | Looks | Use for |
|---|---|---|
| 95–100 | Indistinguishable, large | Masters and print |
| 80–90 | Very good | Hero images, product photography |
| 70–80 | Good | Most web content |
| 50–70 | Visible artefacts on detail | Thumbnails |
| Below 50 | Obvious | Nothing |
Everything Runs Locally
Conversion and compression here use a canvas in your own tab. No file is uploaded, nothing is stored, and the work continues offline once the page has loaded. That is worth knowing for anything containing faces, documents or unreleased work — most online image tools upload by necessity, because they process server-side.
Getting the Rest of the Win
- Serve modern formats with a fallback.
- Always set
widthandheight. Without them the page reflows on load, which
- Lazy-load below the fold — and never the hero, since
loading="lazy"on it delays
- Strip metadata. EXIF can carry GPS coordinates and adds weight to every copy.