Convert APNG to SVG Online

Tracing an Animated PNG into SVG: What This Tutorial Covers

Converting an APNG to SVG is not a repackaging job — it is a trace. The pixels are analysed, grouped into colour regions, and redrawn as real <path> elements, so the result scales to any size without blurring and is nothing like an SVG that merely wraps a base64 PNG in an <image> tag. Two consequences follow, and this walk-through is built around them: only one frame can be traced, and how good the output looks depends almost entirely on whether your source is flat artwork or a photograph. Below: the conversion itself, what the Number precision slider actually changes, and how to tell in advance whether tracing will help you.

How to Convert APNG to SVG

1. Upload Your APNG File: Drag and drop the .apng onto the page or use the upload button. Ordinary .png files work too.
2. Set the Number Precision (1-8): The slider runs from 1 to 10 and starts at 6, but only 1 to 8 is usable. It controls how much numeric detail the tracer keeps — lower values simplify shapes and shrink the file, higher values hold onto finer curves and more colour separation. Positions 9 and 10 abort the conversion and return no file, because the same value is sent as the colour precision and that is only defined for 1 to 8 significant bits per RGB channel.
3. Sanity-check the Source: Tracing suits logos, icons, line art and flat-colour illustration. If the frame is photographic or full of gradients, expect a large, messy SVG and consider a raster export instead.
4. Convert and Download: Click Convert and download the .svg. No sign-up, no watermark. Files are uploaded over an encrypted connection, processed on our servers, and deleted automatically after a few hours.

Walk-through: Setting the Number Precision

One slider drives two things inside the tracer. It sets the path precision — the number of decimal places written into the SVG path data — and the colour precision, the number of significant bits per RGB channel used when the image is clustered into regions. Lower it and colours merge into fewer, cleaner shapes with shorter coordinates; raise it and the tracer separates more colours and writes longer numbers.

• Flat logo, icon, or line art: anything from 4 to 6 gives effectively the same drawing. Take the lower value; the file is smaller and easier to edit.
• Illustration with several distinct flat colours: 6 is a good default — enough colour separation to keep the palette intact without splintering into stray shapes.
• Screenshot or UI capture with subtle greys: 6 to 8, otherwise near-identical greys get merged into one region and the interface loses structure.
• Photographic or gradient-heavy frame: no value rescues it. Tracing is the wrong tool — see "When this doesn't work" below.
• Above 8: the colour-clustering side of the setting is measured in bits per channel and 8 bits is already the full 256 levels, so there is nothing beyond it to gain. Stay at 8 or below; the on-page guidance recommends 4-6.

Here is what that looks like in practice. We traced two frames with the same engine and settings this converter uses — a flat two-colour graphic and a detailed, photographic test frame — at four precision values:

The pattern is the point: on flat art the setting barely matters and every result is tiny. On a photographic frame the path count explodes and the file grows by two orders of magnitude, with no version of it looking better than the original bitmap.

APNG vs SVG at a Glance

Common Errors and How to Fix Them

• "The SVG isn't animated" — expected. The tracer reads one still image; SVG animation has to be authored with SMIL or CSS in vector software. Nothing on this page can generate motion.
• "My SVG is enormous" — the source frame was photographic or gradient-heavy, so every colour transition became its own shape. Lower the Number precision, or accept that tracing is the wrong tool for that image.
• "Colours look flattened or posterised" — Number precision is too low, so similar colours were merged into one region. Raise it toward 6-8.
• "There are speckles and stray dots everywhere" — the source has JPEG-style artefacts or noise, and the tracer is faithfully vectorising them. Clean the frame first, or lower the precision so small differences get merged away.
• "Thin lines came out broken or wobbly" — hairlines a pixel or two wide do not survive curve fitting well. Trace from a larger version of the artwork if you have one.
• "It traced the wrong moment of my animation" — only the default frame is read. Export the frame you actually want as a still image first, then trace that.

When This Doesn't Work

Tracing is an approximation, and it is only worth doing when the source was drawn from shapes to begin with. A photograph, a screenshot of a video, or a heavily anti-aliased render will produce thousands of paths that render slowly, edit badly, and look worse than the bitmap they came from. In those cases keep the pixels: convert the APNG to PNG for a lossless still of the same frame, or to MP4 if you need the motion. And if what you want is a genuinely animated vector, that has to be authored in vector software — no raster-to-vector converter can invent one.

Frequently Asked Questions

Does this produce real vector paths, or just an embedded bitmap?

Real paths. The tracer clusters the image by colour, fits curves to the region boundaries, and writes actual <path> elements, which is why the result stays crisp at any zoom and can be edited node by node in a vector editor. It does not base64-encode your image inside an <image> tag. The trade-off is that tracing approximates the original — excellent for flat graphics, poor for photographs.

Will the SVG be animated like my APNG?

No. Tracing operates on a single still image, so the animation is not carried across. SVG can hold animation, but only when it is authored with SMIL or CSS — a raster tracer has no way to generate that. If the motion is what matters, keep the file as APNG or convert it to a video format instead.

Which frame of the animation is traced?

The default image, which is the first frame. An APNG stores that frame in the ordinary PNG image stream so decoders without animation support still show something; the remaining frames sit in separate chunks that a still-image pipeline ignores. The SVG you get is a vector version of exactly what a non-APNG viewer already displays.

What does the Number precision setting actually change?

Two things at once: the number of decimal places used in the SVG path coordinates, and the number of significant bits per colour channel used when the image is grouped into regions. Lowering it merges near-identical colours and shortens the coordinate numbers, producing a simpler, smaller file; raising it separates more colours and keeps finer curve detail. The page recommends 4-6, which covers most logos and icons.

Should I use a high precision value for better quality?

Only up to a point. Colour precision is measured in bits per channel and 8 bits is already the full 256 levels, so there is nothing above that to gain — keep the slider at 8 or below. And on flat artwork the difference between 4 and 8 is usually invisible: in our own traces of a flat two-colour graphic, precision 4 produced an 819-byte SVG and precision 8 produced 1.1 KB, both a single path, both visually identical.

Why does my traced SVG look worse than the original?

Because the original was probably photographic. Tracing replaces smooth pixel gradients with discrete filled shapes, and there is no setting that makes that look like a photo — you get either a posterised approximation at low precision or thousands of tiny paths at high precision. Vectorisation is for artwork that was drawn from shapes to begin with.

Can I convert the SVG back to a bitmap afterwards?

Yes, and that round trip is common when you want a clean, re-scalable master and then need PNG exports at specific sizes. SVG to PNG rasterises the vector at whatever dimensions you ask for. To trace an ordinary still PNG rather than an animated one, PNG to SVG is the same engine without the animated-source step.

Is my file safe to upload here?

It is sent over a TLS-encrypted connection, traced on our servers, and deleted automatically after a few hours. There is no sign-up, no watermark, and nothing is shared or made public. The main practical limit on a very large APNG is upload time — and, for tracing specifically, how complex the frame is, since a busy image takes longer to vectorise.