I don't know if I'm in the right place, but I would like to know how to transform a pixel image I've made into a vector logo ?

I use this picture for my favicon of my personal web site. And if you have any software recommendations, I work on mac. I prefer use an open source one.

Pixel image


3 Answers 3



This powerful vector graphics application is free, cross-platform, and Open Source. It comes with an inbuilt function to trace vector graphics from bitmaps.

These are the steps involved:

  1. File - Import...: choose to "embed" the bitmap.
  2. Select the embedded bitmap.
  3. Choose Path -Trace Bitmap.... This will open the following dialog:

    enter image description here

  4. Make the following settings for preserving the pixelated square box appearance in the Mode, and in the Options tabs:

    enter image description here

    • Tick Colors.
    • Choose 11 Scans for the 11 colors of your source image.
    • Tick Stack scans to have one object per color stacked above one another.
    • Untick Smooth corners and Optimize paths for resulting square boxes.
    • Click on Update for a preview, OK for tracing the bitmap.
    • Move the vector graphic next to the bitmap for comparing the result (here the selected vector trace is on the right side):

    enter image description here

    • Copy the vector object to a new drawing and save in a file format of your choice.


This guide will not lead to the desired result of a pixelated vector graphic when working on a very small icon source. To still get the pixelated effect on tracing we have to first upscale the icon before importing to Inkscape.

  • one thing I'm curious about @Takkat is if the same abnormality is in your trace as is in Illustrator. If you look at my answer you'll see that the eye isn't exactly a straight line-- is it the same in Inkscape or does Inkscape perform this better? Commented Aug 15, 2013 at 22:16
  • @AdamSchuld: in Inkscape it is the "optimize path" option which we have to deactivate to get straight lines rather than Beziers. There might be not 100% right angles however (hard to test). I believe there is a similar option in Illustrator (but I cant test it on my all Open Source system here).
    – Takkat
    Commented Aug 16, 2013 at 6:51

I'm not proficient in the program, but it can be done in Inkscape. I'm sure someone will swoop in and explain it in inkscape. One thing I noticed when I zoomed in on the image is that there is an impreciseness with those squares in your image. Whoever made this image used alternating row width of 7 pixels and 8 pixels which makes it slightly more involved of a process when making a grid for the pixelated effect.

The low down, quick way is to use image tracing in Adobe Illustrator, it literally takes less than a minute compared to the more involved process of recreating the pixels using a grid. I'm not 100% sure if bitmap tracing in Inkscape will yield the same result.

In any case the process in Illustrator is to import the image and then use the image trace with roughly the same settings as the image below. It will yield a rigid pixel-like effect. enter image description here

The effect zoomed in. For most of the effect there will be no abnormalities. Zoomed In

However, certain areas you will need to fix the paths manually because they are slightly off. Slight abnormalities

  • thank you @AdamSchuld, I choose Takkat open source solution. But you answer may help illustrator users. Commented Aug 16, 2013 at 10:01
  • His answer was better! Glad I could help Commented Aug 16, 2013 at 11:02

There is no need to use vector graphics when you want a pixel-y look. You can just use GIMP to upscale your PNG file. Here's how:

  1. Open your file in GIMP
  2. Select Image > Scale Image
  3. Change the settings to scale your file up
  4. Export your upscaled file as another PNG (press Ctrl+Shift+E or select File > Export)

However, if you're extruding the pixel icon in Blender, then you will have to use the Inkscape method.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.