« 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?

almost 4 years ago, by metastew

4 Replies

blueberry

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, almost 4 years ago

metastew

Thanks, that's a big help!

metastew, almost 4 years ago

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

Thanks, that's a big help!

You got it!

blueberry, almost 4 years ago

SkinnyGeek1010

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

http://davidwalsh.name/retina-favicons

SkinnyGeek1010, almost 4 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.