Mobile app version of vmapp.org
Login or Join
Sue6373160

: How get high clear-cut favicon from illustrator vector logo? When I import vector image to the photoshop from illustrator and try downsampling it with turned on option "Bicubic sharper (best for

@Sue6373160

Posted in: #AdobeIllustrator #AdobePhotoshop #Favicon

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:

10.03% popularity Vote Up Vote Down


Login to follow query

More posts by @Sue6373160

3 Comments

Sorted by latest first Latest Oldest Best

 

@Gretchen549

Way that helped me - was to export all vector shapes of my logo from Illustrator to the Photoshop paths (just copy them in Illustrator and paste as Path to Photoshop), then reduce image with paths to 16x16 pixels.
And then personally fill or stroke any path.
In my case it looked not bad.

10% popularity Vote Up Vote Down


 

@Angie364

The best way overall, as mentioned in comments, is to redraw it at the necessary size.

I've tried many kinds of downscaling but none were of an acceptable quality.

It is genuinely quicker and easier in most cases to just redraw it. Redrawing it with PS can be a bit more difficult than it should be, because arguably, PS was built for much more complex purposes.

That's why I just downloaded a free icon making software. It's extremely simple, and the program is practically built for creating favicons. It took me less than 30 minutes to polish a favicon that I'd already spent hours trying to downsize etc.

The program I use is Icon Craft which you can see below.



Also, I personally drew it at the smallest size, 16px x 16px, and then just duplicated that version for larger dimensions. Which can be done by right clicking on the icon in the menu on the right.

Last but not least, this allows you to create and package multiple favicons in a single .ico file.

10% popularity Vote Up Vote Down


 

@Nimeshi706

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.

10% popularity Vote Up Vote Down


Back to top | Use Dark Theme