JPG TO SVGOpen the image editor →

Visual field guide · 17 October 2026

From image pixels
to SVG paths

A good graphic starts with a clear sequence. This infographic follows one image through preparation, export and vector tracing in JPG to SVG, keeping the useful decisions together in one browser workspace.

Five stages from image pixels to SVG paths: select JPG, PNG or still WebP; crop; set output dimensions; export a raster image or trace to SVG; inspect and download vector paths.
Original explanatory diagram by the JPG to SVG team. The shape illustrations are schematic, rather than screenshots of conversion results.

The five decisions

  1. Select an image. Start with a JPG, PNG or still WebP.
  2. Crop the useful part. Choose a canvas selection or enter precise pixel values.
  3. Set dimensions. Enter the required pixel width and height before exporting or tracing.
  4. Choose an output. Save PNG, JPEG or WebP. JPEG and WebP have export quality controls. Alternatively, continue directly into SVG tracing with the same edited image.
  5. Inspect and download. Adjust color detail and smoothing, compare with the original and use 100%, 200% or 400% zoom. The SVG download contains vector paths.

Put the workflow to use

This sequence is useful for preparing simple logos, icons and illustrations for web pages and design documents. The image editor and tracing workspace processes images locally in the browser, with free use, no account requirement, no added watermark and no conversion-count limit.

Download the PNG infographic · Download the SVG infographic