Conversion of png/jpeg to svg

I am trying to create a few realistic looking HMI screens for my employer. The idea is to get images of the screens and convert them to svg files and use them in perspective so that i can change colours of different elements based on their status.

I am able to only get png/jpeg files and need to convert them to svg.

I am unable to get a real/proper conversion tool to help me do that.
Tried many of them (Pixillion/nch/inkscape/adobe illustrator). But cannot manage to get a good conversion.
The converted images either cannot be seen when embedded or if seen, the elements cannot be accessed to change colour.

Anyone had any experience on converting png files to svg?
Please suggest a tool which can do that.

PNG and JPEG are pixel-based images. SVGs are vector images. There isn’t a simple conversion method. I suspect that you are going to have to redraw.

Post an image file and we can have a look.

1 Like

Yeah seems unlikely you will ever get a good conversion where it will be easy to modify the colors.
Unless maybe you have a source of what the image made. if it came from a photo, then its probably never gonna happen

1 Like

The only way you can do this is to use a trace bitmap function. They can produce nice results depending on your image. Inkscape has this function. Have a play with the settings and hopefully you can achieve the outcome you want. Just be aware that you may have to post process the resulting vector paths

I use this all the time for adding logos into ignition from a png, as non-vector sucks


However in the new nightly build there are updates to the svg importer, so maybe you should try updating to that first to test out your conversions

Yeah have the source of the image. It is generated from an app called the Inventor. This is used by the mechanical team for their design. This app can export the images into png/jpeg and a few other components but unfortunately cannot export as an svg.
Hence looking for a solution to convert into svg.

Thank you. Will try out the tracing option on inkscape.

Hi Victor,
Sorry which version of Ignition is this one? with the new update to svg importer?
I can try.

Seems that inventor can export dxf files that inkscape seems to be able to pass to svg
Its from 2016 tho

version 8.1.22


An alternative is …

  • Create a drawing of the view in Inventor.
  • Print to PDF.
  • Import to Inkscape.
  • Strip out the stuff you don’t need.
  • Save as Plain SVG.

The Inventor drawing may have options on rendering - shaded or not. Try shaded first and see if they are output as true SVG objects.

1 Like

Update: Used Inventor to export the image as a png file. Then used it in Inkscape to convert (using bitmap tracing) and exported it as svg. Works perfectly fine. Thanks all for the suggestions.