: Workflow and software choice when converting complex image to favicon? I have a logotype which is complex (a line screened image consisting of multiple thin lines) that I want to turn into a

@Candy945

One workaround which makes it possible to trace a low-res image on top of a high-res in Gimp or Photoshop goes like this (example in Gimp):


Open the desired original image.
Resize the canvas to a square with the same width and height as the largest dimension of the image. E g if the original image is 800×600, make the canvas 800×800.
Create a new transparent layer on top of the original image.
In the new transparent layer use Filter-Render-Patterns-Grid and create a grid so that the image is devided into 32 rows and 32 columns. Choose a color for the grid that you will not use in the image.
Turn down the opacity a bit of the underlaying original image, it will look like this:





Each square in the grid will become a pixel in the final image, so now fill the appropriate ones until you have something like this:





Last step is to scale this image to 32×32 and save as an icon!

Vote Up Vote Down

@Smith574

I would look into developing your complex design as vector in Illustrator:

Create the line with the Line Segment Tool:



Go to Object -> Expand:



Review the options in the panel:



After ok you should be able to adjust the fill or even apply an outline:



When expanding the lines they will adjust in size if you adjust the artboard in Illustrator.

You could use that to script a variation of sized that were in this article I read once by CSS Tricks titled Favicons, Touch Icons, Tile Icons, etc. Which Do You Need?.

This article led to a generator that could produce everything needed for a webpage named RealFaviconGenerator.

After reading that article I did decide to just create a PNG but since your question asks how to create a favicon I thought I would also provide an Imagemagick solution that can be found here:

convert image.png -bordercolor white -border 0
( -clone 0 -resize 16x16 )
( -clone 0 -resize 32x32 )
( -clone 0 -resize 48x48 )
( -clone 0 -resize 64x64 )
-delete 0 -alpha off -colors 256 favicon.ico

Vote Up Vote Down