« back to discussion

[Request] making favicons

I'm looking to make great favicons.

I usually start with a 512x512 svg canvas and then rescale to 16x16, which always make it look like ass.

Anyone have a good resource for me to look into?

over 5 years ago, by metastew

4 Replies


Here's a good start: http://pineapple.io/resources/creating-pixel-perfect-circles-in-photoshop

and this one: http://pineapple.io/resources/pixel-fitting

Then, once you save your favicon Ive found that this is an excellent tool to convert it to ico. its nice because it creates several variations of vibrancy for you, and pseudo-"sharpening" to improve the look. http://www.prodraw.net/favicon/index.php -- for some reason it appears to not be working at this moment, but i know thats the tool i usually use to give my favicons an extra crisp look

blueberry, over 5 years ago


Thanks, that's a big help!

metastew, over 5 years ago

posted by metastew on Wed, Dec 19 at 03:34PM

Thanks, that's a big help!

You got it!

blueberry, over 5 years ago


Also you can make 32x32 favicons to make them retina ready... they'll scale down to 16x16 for everyone else too.


SkinnyGeek1010, over 5 years ago

Login or to comment.

« back to discussion

Tutorials are any resources you learn from.

Examples: an intro to html5 screencast, a pdf about git, photoshop effects tutorials, meta-programming in ruby, lambda calculus, higher-order fixed-point combinators.

Tools are websites, apps or services used -on- your project (indirectly), to aid the process.

Examples: A color scheme generator, email marketing software, usability heat maps, css3 code generators, a downloadable png compressor.

Assets are downloadable files used -in- your projects, usually as code, textures, or images.

Examples: a jquery sticky menu, photoshop brushes, background textures, mvc frameworks, twitter bootstrap, 960 grid system.