PNG to Vector: A Guide to Converting Files


Across the internet, most image files are either JPG or SVG. There are a few million GIFs floating around and maybe a few hundred thousand Tiffs. But really, when you search for images or find a file uploaded by your average computer user, the format is likely to be a nice reliable jpg or png image. The problem? Raster is on its way out. The graphic design file-format of today is vector graphics, stored in the SVG (scalable vector graphic) file type. From the elements you design with to your saved project files, you likely want to be working in vector files, not the old raster images.

So how do you convert your PNG image files into vector graphics files? Fortunately, the transition isn't challenging at all when you understand how PNGs convert to vectors—and back again.

What are vector image files? How do vectors differ from PNGs?

Vector files are not saved like normal raster files. Raster images like PNGs and jpgs save image data per-pixel. Size is measured by the number of pixels in the grid and each pixel has a single color code. Vectors, however, store colors and shapes as coordinates in a flat file. Each 'vector' is a point that identifies color, direction, angle, alpha (transparency) and fade. This is both a very small way to store the data and absolutely scalable—because the points are relative to each other lines are always clean and there is never any pixelization.

Take an image of a house, for example. Red cube topped by a yellow triangle with a blue rectangle door. In a raster image, zoom in and see the pixels that form the triangle roof line. Zoom out and you lose detail. In SVG, that will be the same angled line, yellow on the inside, at any size or transformation.

SVG vector files preserve PNG transparency and can also store layers and can be easily edited one shape and color at a time as part of ongoing graphics projects.

Why convert PNG images into vector files

So why are we turning all our PNGs into vector files?

  1. To make files smaller and more streamlined for software and website images
  2. To make them more scalable, big and small, eliminating both detail loss and pixelization.
  3. To make assets as part of a larger, layered, graphics projects

The great file conversion from PNG to vector files is fueled by three motivations. The first is speed, we all need lightweight, high-quality image files to create high-performance software and web programs. The second is image quality, we need scalable images that don't lose detail or pixelate when scaled. The third is projects. A PNG turned into a vector can be used as one (or many!) layers in a layered and active graphics vector project. This allows you constantly return and edit layer by layer and shape by shape.

How to convert a PNG into an SVG vector file

There are three ways to convert your PNG files into SVGs. Your choice will depend on the tools at-hand and the quality and detail you need from the final SVG.

Option 1: Export your PNG to an SVG in graphic design software

The best and most detailed way to convert your PNG to vector is a good graphic design program like CorelDRAW. Open your PNG and edit the image until you're satisfied with its quality as a vector asset. Clip the background, clean the edges, and sharpen the lines. Then export the file. When you're asked which file-type to export to, choose vector or SVG.

Option 2: Use a tracer program to build a new SVG

If you have a detailed PNG or pattern, try the "Tracing" tool in your graphic design software. Tracing will identify the shapes and outlines in your image and follow continuous lines. It will “outline” your image, even a photo, to create mapped vector coordinates. This can be used to generate SVG shapes and mimic your image, thus transferring it one shape at a time into vector form.

Option 2: Save your PNG in an SVG editor

Another option is to open a program that naturally works in SVGs and is capable of importing PNG assets. Open a new page or project and import your PNG file. Select your PNG as a now-floating layer of the SVG editor program. If necessary, clip and edit the image. Then save your project into the native SVG format of the editor

Option 3: Use an online web file converter

If you're in a hurry and don't have good art software handy, you can also use one of the many online file conversion websites available. Find a PNG to SVG web tool and upload your PNG. If possible, do a little cropping and editing before you finalize. Then complete he conversion and download the now-SVG file. Be sure to check the quality of the final vector image to ensure the tool understood and managed the task smoothly.

Conclusion

Ready to build a library of vector assets from your PNG resources? So are we. With Corel DRAW, you have the skills you need to manage your PNG and vector image projects from start to finish.


Need to Download CorelDRAW?

Download a Free 15-Day Trial Now!