Zum Inhalt springen
NeedToConvert

Bild in SVG umwandeln

Machen Sie aus einem Logo, Icon oder einer Zeichnung skalierbare Vektorformen, mit Live-Vorschau. Nichts wird hochgeladen.

  • Kostenlos
  • Privat
  • Ohne Anmeldung
Läuft auf Ihrem Gerät. Ihre Eingaben werden nicht hochgeladen.

A PNG logo looks fine at its original size and turns blurry or blocky the moment someone prints it on a banner or zooms in on a retina screen. Vector graphics do not have that problem, because they store shapes instead of pixels. This converter traces a raster image into an SVG made of filled paths, so it can be scaled to any size and edited in Illustrator, Inkscape, Figma or a text editor.

You see the original and the traced SVG side by side, and the trace updates by itself whenever you move a slider. The tracing engine runs in your browser, so unpublished logos and client artwork stay on your computer.

What vectorizing (tracing) an image does

A raster image such as PNG or JPG is a grid of coloured pixels. Tracing first reduces that grid to a small palette of colours, then finds the outline of every area that shares a colour and describes each outline as straight lines and curves. The result is an SVG file in which every region becomes a path with a solid fill. A simple two-colour logo might need a handful of paths, while a detailed illustration can need thousands.

This is the same idea as Live Trace or Image Trace in desktop design software. It is not the same as wrapping a PNG inside an SVG file, which some online converters do: that file has the .svg extension but still contains pixels and still blurs when enlarged. Here the output contains real vector paths only.

Good reasons to trace an image

Recovering a logo that only exists as PNG

Small businesses often have nothing but a low-resolution PNG from an old website. Tracing it with 2 to 6 colours gives a vector version that prints cleanly on signs, vinyl and merchandise, and that a designer can tidy up.

Cutting machines and laser engravers

Cricut, Silhouette and laser software work from vector outlines. Tracing a black and white drawing with 2 colours produces paths those programs can cut or engrave.

Icons and simple illustrations for the web

A flat icon traced to SVG stays sharp on every screen density and can be recoloured with CSS. For a few colours and clean shapes, the SVG is often smaller than a high-resolution PNG.

How the tracer works

The tool uses the open-source ImageTracer library, run in a Web Worker so the page stays responsive. Your image is decoded by the browser and, if its longest side is over 1,000 pixels, it is read at 1,000 pixels on that side for tracing. The paths are then scaled back, so the SVG opens at the original width and height and keeps a viewBox for scaling.

Colours sets the size of the palette, from 2 to 32 (8 by default). Smoothing decides how closely curves follow the pixel edges: None keeps every step, Low (the default) evens out the staircase effect, and High also blurs the image slightly before tracing for rounder, simpler shapes. Remove specks drops shapes whose outline has fewer points than the value you set, which clears away noise and stray pixels. Each shape is drawn with a thin outline in its own colour so no hairline gaps appear between neighbours, and transparent areas become fully see-through shapes.

So verwenden Sie dieses Tool

  1. Drop a PNG, JPG, WebP, GIF, BMP or AVIF image on the box above, click to choose one, or paste it from the clipboard.
  2. Set Colours to roughly the number of colours in the artwork; 2 to 6 suits most logos.
  3. Choose a Smoothing level and raise Remove specks until stray dots disappear from the SVG preview.
  4. Check SVG size and Paths under the previews; fewer paths usually means a cleaner file.
  5. Press Download SVG, or Copy code to paste the markup straight into HTML or a design tool.

Limitations

  • Photos do not turn into realistic vectors. With a limited palette they come out as posterised, poster-like artwork, and with many colours the file can grow larger than the original.
  • Gradients, soft shadows and anti-aliased edges are split into bands of flat colour; there are no gradient fills in the output.
  • Images over 1,000 pixels on the longest side are traced at that size, so very fine details in a large image may be merged or lost.
  • Text in the image becomes outlines, not editable text, and one image is traced at a time.

Häufig gestellte Fragen

Is the result a real vector or a PNG inside an SVG?

A real vector. The file contains only path elements with solid fills, no embedded bitmap, so it stays sharp at any size and can be edited node by node in a vector editor.

Which settings work best for a logo?

Set Colours to the number of distinct colours in the logo plus one or two for edge tones, keep Smoothing on Low, and raise Remove specks until the preview is clean. If curves look lumpy, try High.

Can I convert a JPG photo to SVG?

You can, but expect a stylised result rather than a faithful copy. Photos contain millions of subtle colour changes that a vector made of flat shapes cannot reproduce. Tracing works best on logos, icons, line art, signatures and cartoons.

How can I make the SVG file smaller?

Lower Colours, choose High smoothing and increase Remove specks; each reduces the number of paths. You can then paste the code into the SVG Optimizer to shorten it further.