AVIF to SVG Converter

Turn an AVIF picture into an SVG made of real vector paths: shapes you can scale to any size, recolour and edit in a vector editor. The tool traces the picture: it groups the pixels into a set number of colours, follows the edge of every area and writes each one as an SVG path with straight lines and curves. Logos, icons, stickers and flat drawings trace cleanly; photos turn into thousands of small shapes, so they are better kept as AVIF or PNG. It reads the AVIF file itself and tells you what it is: its size, bit depth, whether it has transparency and whether it is a still picture or an animation. Transparent areas stay empty in the SVG, and an animated AVIF gives its first frame. Your browser decodes the AVIF, so it needs a browser that opens AVIF: current Chrome, Edge, Firefox, Opera and Safari 16.1 or later do. Choose Colours and Detail, compare the SVG with your picture, then download the SVG, copy its code, or get a ZIP when you add several AVIFs. Nothing is uploaded and there is no sign-up.

100% private — everything runs in your browser. Everything runs in your browser; your files are never uploaded.

How to convert an AVIF to SVG

1. Drop an AVIF on the box, or several; or click Try a sample.
2. Pick a starting point (logo, black and white, few colours or detailed), then fine-tune Colours and Detail.
3. Compare the SVG with your picture and check the count of paths and colours under it.
4. Download the SVG, copy its code, or download all of them as a ZIP.

What you can use it for

• Turn an AVIF logo saved from a website into an SVG you can scale for print
• Make an AVIF icon or sticker into vector shapes for a vector editor
• Get a 2-colour SVG of a drawing for a cutting machine or laser cutter
• Recolour a flat illustration by editing its SVG fills
• Convert a folder of AVIF icons to SVG in one go
• Wrap an AVIF in an SVG file when a program only accepts .svg

What happens to each kind of AVIF

Your AVIF	What the tool does	Tip
Still picture (most AVIFs)	Traced into vector paths	Logo or flat art works well
With transparency	Transparent areas left empty in the SVG	Keep Leave transparent areas empty ticked
10-bit or 12-bit	Decoded by the browser to 8-bit colours, then traced	No setting needed
Animated (image sequence)	First frame traced, and the page says so	Save the frame you want as a still first
A HEIC photo renamed .avif	Refused with a message	Convert it to JPG or PNG first

An AVIF file is built from boxes: a file-type box that names the brand (avif for a still picture, avis for an animation), then boxes that hold the picture’s size, its bit depth and, when there is transparency, a separate alpha picture. The tool reads those boxes to describe your file before it traces it.

Choosing Colours and Detail

Start from	Colours	Detail	Good for
Logo or flat art	16	5	Most logos, icons and illustrations
Black and white	2	6	Line drawings, stamps, cutting machines
Few colours, smooth	6	4	Soft or compressed edges
Detailed	32	8	Artwork with many colours; larger files

Colours sets how many colours the picture is reduced to before tracing; Detail sets how closely the outlines follow the pixels and how small a speck is kept. They work the same way as on our PNG to SVG and JPG to SVG pages.

Traced paths or a picture inside an SVG

SVG type	Inside the file	Sharp when enlarged	Editable as shapes
Traced vector paths (default)	path elements, one per colour area	Yes	Yes
Picture inside an SVG	your AVIF as a PNG, in an image element	No, it blurs	No

Some converters only wrap the picture in an SVG file. That gives an .svg that still blurs when you enlarge it, so here it is a separate, clearly named option for when a program only accepts SVG files.

Tips for a clean trace

• Start from the largest, sharpest file you have.
• Fewer colours give fewer, cleaner shapes and a smaller file.
• If small specks appear, lower Detail; if corners look rounded, raise it.
• For a cutting machine, use Black and white, then check the shapes in your cutting software.

Next steps: tidy and shrink the result with the SVG Optimizer, change its colours with the SVG Color Changer, or edit it in the SVG Editor. Tracing a different format? Use PNG to SVG or JPG to SVG. To keep a photo as pixels, use AVIF to PNG or AVIF to JPG.

Sources

Sources: MDN Web Docs: Image file type and format guide; Alliance for Open Media: AV1 Image File Format (AVIF); W3C Scalable Vector Graphics (SVG) 2; imagetracerjs on GitHub (The Unlicense).

Not affiliated with Adobe.

Frequently asked questions

Is this AVIF to SVG converter free?

Yes. There is no sign-up, no watermark and no limit on how many files you trace. Tracing runs in your browser, so your AVIF never leaves your device.

Is the SVG really vector?

Yes, with the default Traced vector paths option. Every colour area becomes an SVG path, and the line under the preview counts the paths and colours. Only the option called Picture inside an SVG keeps the pixels, and the page says so when you choose it.

Which browsers can open AVIF files here?

The AVIF is decoded by your browser. Chrome 85, Edge 121, Opera 71, Firefox 93 and Safari 16.1 or later open AVIF pictures. If yours cannot, the page says so instead of making an empty SVG.

What kind of AVIF traces best?

Logos, icons, lettering, stickers and flat drawings with clear edges and a few colours. Photos and soft gradients become thousands of small shapes and a large file; for those, keep the AVIF or convert it to PNG instead.

Does a transparent AVIF stay transparent?

Yes. Transparent areas are left empty in the SVG, so it sits on any background. Untick Leave transparent areas empty only if you want the invisible shapes kept in the file.

What happens to an animated AVIF?

An SVG made by tracing holds one still picture, so the first frame is traced. The tool reads whether the AVIF is an animation and how many frames it has, and tells you.

What about 10-bit and 12-bit AVIF?

AVIF pictures can store 8, 10 or 12 bits per channel. The browser turns them into ordinary 8-bit colours before tracing, which makes no visible difference to traced shapes.

What size is the SVG?

By default the SVG says it is the same width and height in pixels as your AVIF, and because it is vector you can set it to any size later. The picture is traced at up to 500 px on its long side; choose 1000 or 1500 px for finer edges on big pictures.

Is my AVIF uploaded?

No. Reading the AVIF, tracing it and writing the SVG and the ZIP all happen in your browser.