Convert JXL to SVG

Rendering an SVG into pixels is deterministic: the file says what the shapes are and a renderer draws them. Going the other way there are no shapes in the file at all — a JPEG XL is a grid of colours, and every curve, corner and outline an SVG would need has to be inferred from where those colours change.

That inference is what tracing is, and it is why this pair is described differently from every other one on the site. Nothing about the output is the input. The result is a new drawing that resembles the original to a degree that depends entirely on what the original was, which is the subject of the next two sections and the reason this page exists in the form it does.

It becomes a bad photograph in a large file. The tracer works by finding regions of similar colour and drawing an outline around each one, so it needs flat areas to exist. A photograph has none — it has a continuous gradation of tone in every direction — so the algorithm invents the flat areas by quantising the colours, and the visible result is posterisation.

This was measured before the feature shipped rather than assumed afterwards: a photograph came out around four times larger than the source and visibly posterised, and a gradient banded for the same reason, because a gradient is precisely the absence of the flat regions the algorithm looks for. JPEG XL lists photography among its uses, so a large share of the people who land on this page have exactly that kind of file, and the honest advice is not to convert it.

Flat artwork, and it works better than most people expect. A logo round-trips faithfully — in testing a 6 KB source became a 16 KB SVG with its sharp edges, its correct colours and its rounded corners intact, and the result scales to a billboard without softening. Icons, single-colour marks, flat illustrations and scanned line drawings all fall into the same category.

The common thread is that these images genuinely contain the thing the tracer is looking for: areas of one colour with a definite boundary between them. The SVG that comes out is larger in bytes than the source image and infinitely smaller than a raster large enough to print, which is the trade the format exists to make. That is the case this conversion is for, and it is the only case where it should be the first thing you try.

A screenshot containing text produced an SVG roughly forty times the size of the source. The reason is anti-aliasing: every letter is drawn with a fringe of intermediate colours, and each of those fringes becomes its own small pile of paths. Multiply that by a page of type and the file explodes while looking worse than the pixels it replaced.

If a JPEG XL is mostly words, the question is almost always what you want the words for. To read or paste them, text recognition is the right tool and gives you characters instead of shapes. To keep the look of the page, a raster format keeps it at a fraction of the size. Tracing type is only defensible for a wordmark — a handful of letters that are artwork rather than text — and there four colours and smooth detail is the setting to start from.

The colour count is how many flat colours the drawing is reduced to, and it is the setting that decides everything else. Four suits a logo or a single-colour mark and produces the cleanest shapes and the smallest file. Eight is the default and covers most flat illustrations. Sixteen follows shading more closely at a real cost in size, and thirty-two comes closest to the original while producing much the largest file.

The instinct is to raise it, and on the wrong image that instinct is what turns a poor result into an unusable one. More colours on a photograph means more invented regions and more paths describing them, not more realism. The rule that holds: raise the count only when you can see a specific flat area in the original that the trace has merged into its neighbour. Lowering it is the more useful direction. A two-colour mark traced at four colours often comes back with a third and fourth colour made entirely of the anti-aliased edge between the other two, and dropping to four — or redrawing the mark on a clean background before tracing — removes those outline shapes rather than tidying them.

The detail setting controls how tightly the paths follow the pixels. Smooth accepts a looser fit and discards shapes below sixteen pixels, which removes the specks anti-aliasing leaves along every edge. Balanced is the default and halves both thresholds. Sharp follows the pixel grid closely and keeps shapes down to two pixels, specks included.

Blurring the image before tracing would reduce the speck count further and is deliberately not done, because it softens exactly the sharp edges that are the only reason to trace a logo in the first place. Start at balanced. Move to smooth when the result is littered with stray fragments around the outlines, and to sharp only when a genuine small detail — a serif, a thin rule, a notch in a mark — has been swallowed.

The image is scaled down to 1,600 pixels on its longest edge before tracing. Tracing cost grows with the number of edges rather than with the file size, and a large photograph has an edge almost everywhere, so left alone a 12-megapixel source can produce a multi-megabyte SVG over tens of seconds — a worse outcome than the one you were trying to avoid.

Unlike a raster conversion, this is not a loss of fidelity. The output is resolution-independent, so a logo traced at 1,600 pixels wide and the same logo traced at 4,000 render identically at any size; what changes is only how closely the paths hug the original pixel grid. The downscale is done with the browser’s filtered scaler rather than a nearest-neighbour loop, because an unfiltered downscale would alias every diagonal into a staircase the tracer would then faithfully reproduce.

Nothing here inspects the image and predicts whether it will trace well. A colour-count heuristic would be a guess, and the real answer is available for free a moment later: trace the file, then compare the two byte counts. The interface shows both, so you find out which of the outcomes above you got before you commit to it.

That is the check worth making a habit. An SVG smaller than or close to the source almost always means the trace found real shapes. An SVG several times larger means it invented them, and the honest response is to discard the result rather than to tune the settings — no combination of colours and detail turns a photograph into flat artwork, because the flat artwork was never there.

This is the real prize when the trace works. A JPEG XL is not an editable format: you can filter it, crop it and re-encode it, but you cannot select the mark and change its colour, because there is no mark, only pixels that look like one. An SVG is a text file describing shapes, and Illustrator, Inkscape and Figma all open it as objects you can move, recolour and delete.

So the reason to trace a logo is rarely scale alone. It is to recover an asset that exists only as a picture — an old mark from a scanned letterhead, an icon whose source file nobody kept — into something that can be worked on again. The output is also a text file, which means it can be opened in an editor, diffed, and put under version control like any other source, and its fills can be changed by search and replace when a brand colour moves. Where the original vector file still exists somewhere, finding it always beats tracing, because a trace is an approximation and the original is not.

A trace inherits every flaw in its source. If the JPEG XL is a low-resolution copy, a screenshot of a logo, or an image that has been through several lossy re-saves, the tracer faithfully reproduces the softened edges and the compression artefacts as shapes, and the result looks approximately right and wrong in detail at large sizes.

For anything that will carry a brand — a sign, a print run, a website header — a trace is the starting point and not the delivery. Somebody redrawing the mark properly in a vector editor, using the trace as a template, produces a file with clean curves and correct geometry. This conversion is excellent at getting you something to work from and should not be mistaken for something to ship.