How to Convert PNG to SVG in Photopea
What Photopea's SVG export actually does with a PNG logo, how to trace the artwork into real vector paths, and how to check the file before delivery.
Contents
Photopea can save a PNG as an SVG file, but a plain export usually wraps the original pixels inside an SVG container. It does not turn them into editable shapes. To get a true vector logo, you have to trace the artwork into paths and then export. You can trace with Photopea's automatic vectorizing command, if your version has it, or draw the paths by hand with the Pen tool. The rest of this guide explains both routes and how to confirm that the result is genuinely vector.
Raster vs. vector: the terms that decide the result
A PNG is a raster image, a fixed grid of colored pixels. When you enlarge it, edges become blurry or jagged. An SVG (Scalable Vector Graphics) file describes artwork as paths, which are lines and curves defined by anchor points, so it can be scaled to any size without losing sharpness. However, the SVG format can also hold embedded raster images, so the .svg extension alone tells you nothing about what is inside. Converting pixel edges into paths is called tracing or vectorization, and that step is what actually turns a PNG logo into vector artwork.
What a direct export gives you
If you open a PNG and go straight to File > Export As > SVG, the logo is still a pixel layer, so the exported file stores it as an embedded bitmap. That file will not scale any better than the original PNG, and you cannot recolor or reshape it as separate vector objects. A printer, sign maker or developer who asks for vector artwork will usually reject it. A direct export only helps when something specifically needs an .svg container and does not care about the content.
Option 1: Automatic tracing
Recent versions of Photopea include a command that converts bitmap content into vector shapes. Look under the Image menu for an entry along the lines of "Vectorize Bitmap." No documentation was supplied for this guide, so the exact menu name, location and settings may be different in your version.
- Open the PNG with File > Open. Use the largest and cleanest version of the logo you have.
- Crop to the logo and remove background clutter, stray pixels or compression artifacts, because the tracer will try to turn all of them into shapes.
- Run the vectorizing command. If it offers settings such as the number of colors or the level of detail, adjust them while watching the preview.
- Zoom in and inspect the result, paying close attention to corners, curves and small lettering.
- Hide or delete the original pixel layer so that only vector shapes remain.
- Export with File > Export As > SVG.
Automatic tracing works best on logos made of flat colors, solid shapes and strong contrast. It struggles with gradients, drop shadows, photographic elements, very small type and low-resolution sources. Those features tend to produce wobbly edges, rounded-off corners and a very large number of anchor points.
Option 2: Tracing by hand with the Pen tool
Manual tracing takes longer but gives you control over the geometry. Use it when the automatic result looks lumpy, or when the logo depends on precise circles, straight lines or exact letterforms.
- Keep the PNG as a reference layer, lower its opacity and lock it.
- Set the Pen tool to Shape mode. Draw each outline by placing anchor points at corners and at the outermost points of curves. Fewer, well-placed points give smoother curves.
- Draw geometric parts with the Ellipse and Rectangle tools instead of freehand paths.
- Put each color on its own shape layer and fill it with the correct color value.
- For text, if you know the typeface and are licensed to use it, retype it as a text layer and convert it to shapes before export. This way the recipient does not need the font installed.
- Delete the reference layer and export the file as SVG.
There is also a quicker, rougher shortcut for flat-colored areas. Select a region with the Magic Wand, then use the Paths panel to create a work path from the selection, if your version offers this. Expect to clean up the resulting path afterward.
How to verify the SVG is really vector
Open the exported file in a plain text editor. If you see an image element carrying a long base64 data string, the logo is embedded pixels. If you see path elements (or shapes such as circle and rect) with fill colors, the artwork is vector. The snippet below is a simplified illustration of the two cases.
<!-- Embedded bitmap: not true vector -->
<image href="data:image/png;base64,iVBORw0KGgo..." />
<!-- Vector shape: scalable and editable -->
<path d="M10 20 C30 5, 50 5, 70 20 Z" fill="#1A1A1A" />
- Zoom in far in a browser or vector editor. Edges should stay crisp at every size.
- Open the file in a vector editor and confirm you can select and recolor individual shapes.
- Check the number of anchor points. Heavy clusters of points usually mean the trace picked up noise.
- Make sure there is no stray white background rectangle unless you want one.
- Confirm that text has been converted to shapes, or note which font the file depends on.
- Place the trace over the original and compare. Tracing can subtly change letterforms and proportions.
Before you deliver or reuse the logo
A traced SVG is a reconstruction, not the original master artwork. For brand-critical work, ask the logo's owner or designer for the original vector file and use that instead of a trace. Converting a file also gives you no right to use the mark. Neither the file format nor the extension shows that you have permission, so confirm your usage rights before you edit, deliver or publish someone else's logo.