SVG vs PNG
A PNG is a grid of coloured squares. An SVG is a list of instructions — "move here, curve to there, fill with this colour". That single difference explains everything about when to use which, and why converting from one to the other is easy in one direction and hard in the other.
Raster: PNG, JPG, WebP
Raster files store pixels. Enlarge one and the squares get bigger; there is no more information to show. They are the right format for photographs and for anything with continuous tone, because a photo is a grid of samples. PNG stores pixels losslessly and supports transparency; JPG compresses lossily and does not; WebP does both in a smaller file.
Vector: SVG
SVG files store shapes as maths: points, lines and Bézier curves, plus fills and strokes. They render sharply at any size, they are usually tiny for logos and icons, every shape can be selected and recoloured, and text-based tools can read them. They are the right format for logos, icons, diagrams, lettering and illustrations built from flat shapes. They are the wrong format for photographs — a photo as SVG is a huge posterised approximation.
| PNG / JPG / WebP | SVG | |
|---|---|---|
| Stores | Pixels | Shapes |
| Scaling | Blurs or pixelates | Always sharp |
| File size (logo) | Grows with resolution | Independent of size; usually small |
| Editing | Repaint pixels | Move points, recolour shapes |
| Photographs | Ideal | Poor |
| Print / cutting / embroidery | Often rejected | Expected |
Converting SVG to PNG
Easy and exact: the renderer draws the shapes at whatever size you ask for. GetSVG does this for its own results (PNG at 1×, 2× or 4×), and every vector editor and browser can do it.
Converting PNG to SVG
This is the hard direction, because the information about where the edges are has been lost — there are only pixels. A vectorizer has to infer shapes: decide which pixels belong together, find the outline, and fit curves through it. The result is good when the original was made of flat shapes with clear edges (a logo) and poor when it was not (a photo). That inference is what GetSVG does, on your device.
"It says SVG but it is still blurry"
Some converters produce an SVG that merely wraps the original PNG in an <image> tag. It has the file extension and none of the benefits. Two ways to tell: open the file in a text editor and look for<path elements, or, in GetSVG, turn on the Paths overlay and look at the anchor points. GetSVG's output contains only paths.
Ready to convert one? See PNG to SVG or the logo guide.