Favicons have become a standard element in web design, and they can have a tremendous impact on brand recognition (see Matt Magain’s post, “Google Changes Favicon, Challenges You To Do Better“). If you’re not used to designing for a tiny area (just 16×16 pixels), it can be very difficult to create a distinguishable company-specific or site-branded favicon. And depending on the logo, colors, words, etc. that you’re working with, it can be a challenge to create one that actually looks good.
In my constant search for favicon inspiration, I compiled a list of more than 80 creative and well-designed favicons that successfully portray the look and feel of the website or brand. There are probably thousands more that are suitable for this list, so if you have a few of your own favorites, share them in the comments.
Now that you’re inspired, it’s time to create your own favicon that’s as smooth as the examples above. Here are a few resources you may find useful:
- 20 Best Favicon Online Generators on CSSJuice
- Mysteries Of The Favicon.ico – How To Create A Favicon In Photoshop by Jennifer Apple
- Creating Favicons with Adobe Photoshop and GoLive on Amenco
- Favicon Tutorial on Heaven Graphics
- Creating a simple web 2.0 favicon – Tutorial on Sankaranand
- Making a Good Favicon on Snook.ca
Hey! Where is mine? http://www.bonsai-studio.net :D
February 27th, 2009 at 7:16 am
the url for the White House is incorrect
February 27th, 2009 at 7:26 am
While I agree that some of these are stunning (skype, MTV, hulu, pepsi) i question why some of the others were included. I can’t believe the NY Giants don’t have the resources to find white pixels, and i’m underwhelmed by some (like Petco, USPS or HGTV for example) that appear to be really poor renderings of the company logo. Yes, a favicon is an exceptionally hard design challenge, but that makes the incredibly elegant simplicity of something like the Facebook or hulu favicon all the more impressive.
I can appreciate the effort that went in to compiling this list, but it seems like there are a lot of very weak favicons here for a post that is nominally about great ones. :/
February 27th, 2009 at 7:38 am
Sorry that last comment was mine, I didn’t realize that I wasn’t logged in.
February 27th, 2009 at 7:38 am
Just like design, “stunning” is subjective. If you have others you think are a good fit for this list, specifically list them. Should also note it’s a compilation of well-branded favicons, which all of the ones you question certainly are.
February 27th, 2009 at 7:43 am
I like the BMW one.
What someone may find interesting is this, a website http://www.wausita.com/ which lets you search using favicons.
February 27th, 2009 at 7:49 am
Creatives at Google; check out the favicons list above.
They are not as good as some great icons listed here, but I’ll link two of mine below:
http://themuseumofinnocence.com/
http://bytes.com/
February 27th, 2009 at 8:34 am
I’m surprised that Seventhman hasn’t been sued by PepsiCo yet…
February 27th, 2009 at 8:50 am
Signe – You’re right! I was thinking the same as I was looking it over earlier.
February 27th, 2009 at 9:27 am
I think ours is pretty nice although it is simple :)
http://www.graythought.com
February 27th, 2009 at 9:41 am
Target, twitpic and twhirl are all great.
February 27th, 2009 at 9:42 am
My school, http://www.iupui.edu/
February 27th, 2009 at 10:57 am
I’ve always liked Jeremy Keith’s…
February 27th, 2009 at 9:56 pm
I like mine :D
http://www.nugc.net/
February 27th, 2009 at 10:50 pm
The MTV one is the best IMO.
February 27th, 2009 at 11:03 pm
I just learned how to do this a couple of weeks ago! I like mine, but I think it’s not showing up well enough. Do I make it a different color? White? Put a white box behind it? All suggestions are welcome!! It’s kind of just a green blob right now.
http://woosterpublishing.com/
Thanks!!!
Of these, I really like Blooms Today, Yelp, Flock and Target. I guess the more abstract ones, now that I think of it! On my browser right now, the favicons that stand out are Facebook, Amazon, Blogger, and Coached by Susan (and, of course, SitePoint!).
Greta
February 27th, 2009 at 11:09 pm
Some great suggestions added! What’s your feeling on animated favicons? Check out Georgia Aquarium above.
February 27th, 2009 at 11:21 pm
Georgia Aquarium’s doesn’t show for me…
I like the simple ones myself… graythought’s was good, purina, facebook, espn, redtag, dell, etc… they provide recognition and simplicity all at once.
Too many companies try to put their full logo in there and it just looks off.
February 28th, 2009 at 12:21 am
If you can’t show the whole logo, sometimes just part is as good?
http://www.rotary1220.org/02
February 28th, 2009 at 5:59 am
I love the pepsi and target icons. Another one I’ve been digging lately is the dhl favicon. I think it’s a love it or hate it one.
February 28th, 2009 at 7:52 am
I like my little favicon at Apartmentreviews.com.au :-)
February 28th, 2009 at 9:44 am
I like the DHL favicon! Although I’m not sure I’m sold on animation. It definitely works for them, though.
February 28th, 2009 at 10:56 am
One of the most impressive ones there is YouTube – they managed to fit the words ‘you’ and ‘tube’ all into a 16px icon and make the words recognisable.
Also, what’s with the similarity between ‘Visible Theory’ and Flickr? Just sayin’.
February 28th, 2009 at 4:04 pm
How about the one from the InfiniteMac OSx86 Community? I love it! :*
=> http://www.infinitemac.com
March 1st, 2009 at 1:25 am
I recorded a video tutorial on my blog on how to design a favicon:
http://how.todesignyour.com/blog/photoshop-tutorials/how-to-design-a-favicon/
March 1st, 2009 at 10:47 am
I’d like to add mine to the mix…
http://www.visualrhythm.net
March 2nd, 2009 at 6:17 pm
There are also web services that allow to display PNG favicons from web pages, for example Faviconiac: <img src=”http://www.faviconiac.com/favicon/sitepoint.com/” /> will display the sitepoint favicon.
March 6th, 2009 at 5:32 am
Great collection of fav icons. This is the most I’ve seen in one place. This chicago web design studio I started working for was teaching me all about it.
March 24th, 2009 at 1:01 pm