Advertisement


How get high clear-cut favicon from illustrator vector logo?


Question

When I import vector image to the photoshop from illustrator and try downsampling it with turned on option "Bicubic sharper (best for reduction)". But Photoshop still provides its interpolations and I stil dont get high clear-cut small image as on others sites I see. Example:

enter image description here

2014/11/28
1
1
11/28/2014 11:35:00 AM

The scale of a favicon (typically 16x16 pixels, although nowadays larger sizes are 'accepted' as well and scaled to fit by most browsers) is too small for general software to do anything useful with.

For the best possible favicon, just draw them one pixel at a time. The image below took only 3 minutes or so.

Note that it is not displayed at 100% -- it really is 16x16 pixels. That's why the black lines are considerably thicker than the white parts, when compared to your original vector image.

The extra white on the right and bottom is because your logo is strongly symmetrical. I recognized that and so chose to move the design 1/2 pixel to the top left, rather than attempting to keep the original positioning by converting them to antialiased gray lines. That is not something current software is able to do at this scale -- it needs human judgement.

look! a favicon!

2014/11/28
2
11/28/2014 12:19:00 PM