SVG to Code
Menu

Input

Supports PNG, JPG, JPEG, WEBP, and AVIF. Works for pictures, photos, icons, and illustrations — pick presets that match your source. Clean images usually produce better vector output.

Drop PNG, JPG, JPEG, WEBP, or AVIF — or click to upload

Tracing settings

Preset
Output style
Color mode
4px
Preview
100%

Load a supported image to preview the traced SVG.

Download SVG

Raster → vector hub

Convert Image to SVG

Upload a PNG, JPG, JPEG, or other raster image, trace it into vector SVG, adjust the settings, and download the result online.

Supports PNG, JPG, JPEG, and WEBP. This page is the broad entry point — when you know the exact format, the dedicated converters below add sharper guidance and defaults.

After converting your logo into SVG, you can still ship browser icons from a bitmap with the Favicon Converter — or export PNG from SVG first if you need a raster master.

Supported image types

Jump to a format-specific page when you want copy and defaults tuned for that source file.

Best for

Tracing works best when the subject has clear shapes or limited color complexity — regardless of whether you started from PNG, JPEG, or WEBP.

  • Logos and wordmarks
  • Icons and UI glyphs
  • Illustrations and diagrams
  • Simple photos and product shots
  • Scanned artwork and signatures

How it works

  1. 01

    Upload an image

    PNG, JPG/JPEG, or WEBP — drag in, pick from disk, paste from the clipboard, or try the example.

  2. 02

    Adjust tracing settings

    Pick a preset, output style, color mode, and optional advanced controls until the vector preview matches your intent.

  3. 03

    Download SVG

    Export SVG, copy the source, or open it in SVG to Code for cleanup and inspection.

FAQ

What image formats are supported?

This hub accepts PNG, JPG/JPEG, and WEBP in the browser tool. Specialized pages (PNG to SVG, JPG to SVG, and WEBP to SVG) go deeper on each format.

Can I convert PNG, JPG, and JPEG to SVG?

Yes. Upload any of those types here, tune tracing, preview, and download SVG. Defaults start balanced (Poster preset) so both icons and simple photos are usable.

Which settings work best for logos or photos?

Use Poster or B&W for logos and icons; Photo for softer photographic sources. Adjust noise filtering when you see compression speckle.

Is the output a real vector SVG file?

Yes — standard SVG paths and groups you can edit elsewhere. Complexity still depends on your source image.

Why do detailed photos create large SVG files?

Photos contain subtle color variation, so the tracer emits more shapes. Simplify with presets, noise controls, or move to a format-specific page for tailored tips.

Related tools

How-to guides

Step-by-step help for common SVG workflows. Each guide includes the matching tool so you can try it immediately.