Make a favicon
Okay, I recently made the cheesiest favicon evah. (A favicon is that little icon beside a url in the address bar of your browser.) December14.net gives a great explanation of how to make your own favicon.
The brief version on Windows XP is:
- Download Paint.NET.
- Resize your blank image to 16×16.
- Change your window size to 3200% (it’s a drop-down).
- Toggle grid mode on (right next to the window size drop-down).
- Make a dinky image with 16 or so colors.
- Save as favicon.png (in PNG format). It might look like this: 
- Use png2ico (warning: zip file) with syntax like “png2ico favicon.ico –color 16 favicon.png” to make your favicon.ico file. That’s two dashes before the “color.” Silly Wordpress converts it to a single long dash. Anybody know how to undo that?
- Upload the favicon.ico file to the root level of your website.
Not so hard, except for the part requiring artistic talent. That why all my doodles are geometric. 
MacBasedLifeform Said,
May 16, 2006 @ 2:07 pm
I have the talent, but I don’t do Windows! I tried making a favicon through my Mac software, but no luck. Any suggestions?
Search Engines WEB Said,
May 16, 2006 @ 2:12 pm
This site gives free quality Favicons for downloading - you can also import them into an editor and add your own touches
clickfire.com/content/graphics/favicons/
Of course, you can Still import Gif or JPGs into some online editors and modify them or even combine them
Brian M Said,
May 16, 2006 @ 2:13 pm
I see the geometric design you intended, but I had to drag your link around in the Internet Explorer browser, put it back into the address bar, close the browser, and then re-open it…
It seems to be fine in Firefox from here…
Brian M
Greg Said,
May 16, 2006 @ 2:14 pm
have you ever tried this?
http://www.favicongenerator.com/
it’s free … it kicks butt!
Ryan Said,
May 16, 2006 @ 2:16 pm
that stuff requires too much work.
This website lets you do it with just a photo:
http://www.chami.com/html-kit/services/favicon/
Jonathan D. Said,
May 16, 2006 @ 2:18 pm
YEAHHH go geometric doodles!!!! lol
Mladen Adamovic Said,
May 16, 2006 @ 2:34 pm
In fact it is much easier to use online converter like Online ICO converter . It has some advanced features like favicon animation. And you don’t have to install anything.
JonH Said,
May 16, 2006 @ 2:39 pm
Nice post. However IE does some weird things with Favicons. It initially displays the favicon but then overwrites it. Any idea what causes that?
mincus Said,
May 16, 2006 @ 3:07 pm
enclose the whole string in “code” tags.
(This probably wont render properly in a comment, if it doesn’t, I attempted to type “less than”, “code”, “greater than”, “–”, “less than”, “forward slash”, “code”, “greater than”)
<code>–</code>
Thomas Said,
May 16, 2006 @ 3:09 pm
You make that WAY to hard.
Step 1) Create a 16×16 image.
Step 2) Save it as a .png and use that as a fav icon - done
-or-
Step 2b) Save it as a .bmp file and rename it .ico - done
Here is the code to include in your webpage (png or ico)
Thomas Said,
May 16, 2006 @ 3:10 pm
Ack, it cut off my code. See the source of my website, http://www.twistermc.com, for the code.
Matt Cutts Said,
May 16, 2006 @ 3:23 pm
Cool. Online web services to convert things *rule*.
Rich Said,
May 16, 2006 @ 3:25 pm
I made a really cool favicon that looks much nicer than the current icon that Google uses and submitted it to them a long time ago but no one ever gave me a reply on it but can I send it over for you to look at? The one you have is really cool and I can make it a transparent background for you if you would like? Looks much nicer in your favorites with only like just the diamond showing? Try the icon on the site shown above it has a transparent bg like Yahoo’s
Dio Said,
May 16, 2006 @ 3:52 pm
I’ll never forget my first favicon, took hours building up two letters (DB) at a pixel a time using some nasty favicon freeware thing. That was back when you had to have the favion link in your header. Now I just jump over to that http://www.chami.com/html-kit/services/favicon/ site that Ryan mentioned, and woof - away!
The joy of it first working is hard to remember, but I remember how exhilarated I was at the time. Did you notice that site does animated ones as well? That’s just too much imo.
Aaron Pratt Said,
May 16, 2006 @ 7:44 pm
Let me move my favicon over to my little bad neighborhood for show and tell.
The URL is: http://www.seobuzzbox.com/favicon.ico
and you know what rules more than favicons?
ski cap dudes!
*
Aaron Pratt Said,
May 16, 2006 @ 7:49 pm
Grrr what fun is show and tell if you can’t post images or character’s in here?
(my favicon is a whiskey barrel BTW)
;-(
Max Smolev Said,
May 16, 2006 @ 7:58 pm
Of course it would be the best if Google actually used that Favicon too
Just like Yandex does, which adds a bit of pizzaz to the result page (along with visual oddities) 
Matt Cutts Said,
May 16, 2006 @ 9:14 pm
I’ll do it for you, Aaron:
JohnMu Said,
May 16, 2006 @ 11:55 pm
How about other resolutions / color-depths? tsk tsk — still making Windows 3.1 16×16, 4 bit icons?
Jon Cram Said,
May 17, 2006 @ 3:33 am
Thomas said:
>> You make that WAY to hard.
And now for the really really easy way:
1) Create an image using almost any decent format
2) Use the code:
I’ve found this to work with ico (of course), jpeg, png, bmp and gif.
The pleasantly annoying thing is that animated gifs often work fine as favicons. Surely a good way to annoy visitors just a little more.
Jon Cram Said,
May 17, 2006 @ 3:36 am
Hmmm . . . there needs to be a guide here as to how to format comments so as to include code examples.
Oh well, nevermind. My code above which is now missing is merely the normal code for favicon but merely points out that the favion file name (and extension) can be whatever you like.
Ian Said,
May 17, 2006 @ 4:00 am
By the way, many people aren’t really aware that an ICO isn’t just like a renamed BMP, it’s actually a container of such images. You can have multiple different sizes in an icon (e.g. 16×16, and 32×32). That’s how they make windows icons scale properly (and MacOS X has some really big icons).
Also, Firefox supports icons in other image formats apart from ico - it at least supports PNG and animated GIF’s - you can actually have your favicon animated in Firefox, though it can be pretty annoying
Markus Said,
May 17, 2006 @ 7:05 am
I use Irfan View (freeware) to make favicons! You can define the transparency color, make 16px favicons and really fast some other things..
Aaron Pratt Said,
May 17, 2006 @ 7:16 pm
thanks matt!
amit Said,
May 18, 2006 @ 5:08 am
paint.net nifty cool tool..thanks matt..
Ed Said,
May 19, 2006 @ 10:41 am
Hi Matts,
Any idea why your favicon does not show up in bloglines? I have the same problem ;-
Haochi Said,
May 21, 2006 @ 11:56 am
The easiest is open the PNG file on your browser and save it in .ico format. That works.
Also, I would prefer a transparent background, which better looking on the toolbar.
-Haochi
John Hood Said,
May 23, 2006 @ 7:21 am
A great Photoshop plug-in can be found here:
http://www.telegraphics.com.au/sw/
Hope this helps.
Warped doodler Said,
May 27, 2006 @ 2:15 am
Please forgive my odd sense of humor, but I think Matt Cutts suggests a Matt Cutter (sharp blade tool that cuts through knots) as an appropriate icon. Hope this posts properly
Warped doodler Said,
May 27, 2006 @ 2:36 am
Drats. Here’s the link to the icon I thought you might like: http://www.goldendoodles.com/mattcutter.jpg
Take it or leave it
SEOidiot Said,
May 29, 2006 @ 3:23 am
Matt,
I made a favicon for you…. its over on my blog… i also did a cartoon of you to join my shoemoney toon over there
Alfredo Said,
June 14, 2006 @ 5:51 am
I got this WordPress theme where they use .gif instead of .ico in making favicons. Here the code
I think its more flexible that making .ico files. If I do need to make .ico, i use Axialis IconMaker
Alfredo Said,
June 14, 2006 @ 5:53 am
oh im sorry, the code was not displayed in previous reply. Just check the source code of my site, http://alfredo.palconit.com to see it.
Thanks,
Alfredo
Jay Said,
June 14, 2006 @ 9:31 pm
http://www.myfavatar.com provides free favicons hosting. You Just need to upload an image.
Another website is http://www.favicon.ru/en . You can create a 32×32 and 48×48 icons on top of the standard 16×16 icon.
FGS Said,
June 15, 2006 @ 3:00 am
Any other site offer favicon like clickfire.com/content/graphics/favicons/ given by user “Search Engines WEB” above??
JJTucker Said,
June 19, 2006 @ 11:58 pm
Right on this looks really cool, it’s just sooo late I’ll try it later…
ymid Said,
June 30, 2006 @ 4:32 am
will there be any difference between the different sizes? we have 32×32 on our site … looks alright but not so sure whether we should use larger ones? will it be scaled down to so-called “standard size”?
Tool Man Said,
July 9, 2006 @ 2:45 am
Why is it that on some sites I see the fav icons and others not?
(When there is quite clearly fav icons there)
Is it some kind of setting in IE?
Thanks.
Rob Sans Said,
August 3, 2006 @ 6:14 am
Typically, IE requires sites to be bookmarked before favicons actually appear (and even then, after a few seconds lag). Try bookmarking those where it’s not appearing and see what happens
netfreez Said,
August 19, 2006 @ 12:01 am
Hello,
I am not certain but i would almost believe that the new IE7 will have the ability to display the “favicon”, it’s unfortunate that it only displays the icon once shortcut is created or within favorites. I have gone through more complex hurdles creating my favicon on http://www.netfreez.com
Thanks,
db
Ryan Said,
August 24, 2006 @ 7:58 am
The png2ico argument should be –colors, not –color.
Zafar Said,
September 5, 2006 @ 4:29 pm
nice to learn this. Always wondered how it was done but never bothered to search for it.
PS: verification process for adding comment on this blog is getting tougher and tougher. Single digit addition is ok but when I saw [Please add 10 and 1], I ran for my calculator:)
jr Said,
September 11, 2006 @ 7:32 pm
Favicon Battle
russian Said,
September 16, 2006 @ 6:43 am
As already spoke Jay, I advise to look Russian on-line service on creation favicon http://favicon.ru/. Very quite good.
Jonathan Said,
October 12, 2006 @ 2:37 pm
I love favicons…they really help to seperate one site from another
Fantasy Said,
November 12, 2006 @ 5:59 am
I agree with you Jonathan i also think that favicons are graet.
Also i think that it would be good if favicons would be added to website coding standards, then everyone would need to use one.
Scented Candles Said,
December 12, 2006 @ 9:38 am
This is a cool feature but requires some skills….
Sterling Silver Jewelry Said,
December 12, 2006 @ 9:39 am
Really love the favicons….
Sally Said,
January 30, 2007 @ 7:17 pm
Hi there reader.
Favicon doesn’t display on my IE - Microsoft said IE5 will, but never. I bookmarked a site 3 times, repeated it few times for different sites, and still no luck
If “fav” (FAVorite) is for IE, then why not “boo” (BOOkmark) for non-IE, making it “booicon“?
If you have NO booicon yet, go ahead, put ONE inside ROOT directory of your site. Or else, don’t be surprised to see a “404 File Not Found” error entry for “favicon.ico” on your server’s log…
Mind you, Opera is now always looking for:
1) http://www.Your-Domain/favicon.ico
2) Subdomain.Your-Domain/favicon.ico
… and similar variations, if any.
That’s why there are times when a 3KB file takes the same time to load as a 30KB file, and it’s not a joke. Your booicon (or whatever when it’s not there) will be loaded BEFORE your actual contents.
Thanks.
Sally Said,
January 30, 2007 @ 7:31 pm
Whoops!
I didn’t mean to make the URL in #1 to be a “click-able” one - WP saw that “www.” I guessed. Don’t click. If you do, it’s your prob… lem. hehe.
P.S. I was previously asked what’s the sum of 6+10, and now it’s 7+9. I’m waiting for 4+4+4+4 …
Dave Starr Said,
February 5, 2007 @ 1:50 am
This ittle site will do it well, also:
http://www.html-kit.com/favicon/
Throw Pillows Said,
March 2, 2007 @ 11:25 am
Cool geometry feature!
Joe Said,
April 26, 2007 @ 5:31 am
hey matt, your blog has a great webdesign. is it a wordpress standard???
nicolas Said,
June 7, 2007 @ 1:18 am
I just found one free favicon generator.
http://www.webscriptlab.com, Free and easy to use online tool that can create a favorites icon (favicon.ico) images for browser address bars, favorites and tabs, from pictures, logos and other graphics.
Brandon Buttars Said,
June 19, 2007 @ 11:23 am
I haven’t seen it posted yet, but the best icon maker I have found is called Liquid Icon. It’s FREE and you can copy and paste and it resizes the logo to fit. You can create 16 x 16, 32 x 32, and 48 x 48. It’s the bomb. You can download it at http://www.x2studios.com/index.php?page=products&id=11. The best thing I’ve found. I use Fireworks to draw it up and then paste it in to there.
baby Said,
August 21, 2007 @ 1:46 pm
Ah, thanks so much for that! I’ve always wondered how to make those things – didn’t even know what it was called. Been wanting to get a favicon for my site for ages – just didn’t know how to do it, or where to find one. It would be good if someone could post how you could edit this for wordpress – that would be awesome.
Joe W Said,
September 15, 2007 @ 2:02 pm
Love this blog! I recently found this online generator to make my favicons—
Quick Favicon There are a lot of them out there. I also recommend downloading The Gimp Gimp It’s open source and can do just about anything Photo Shop can do. I also recommend Irfan View Irfan And if you can manage to find the free version of “Faststone” (not free anymore) which I have. These will do any novice well!
Joel Hancock Said,
November 2, 2007 @ 9:07 pm
Many browsers display favicons no that aren’t the .ico file type. For example could just as easily save your favicon as a .png, .gif, or .jpg and it will show up fine.
The favicon gallery at favtastic.com has plenty of favicons on it that aren’t just .ico images. Check it out.
Pet portrait artists Said,
January 7, 2008 @ 11:18 pm
Wow! Interesting! I’m going to try this myself and see if I can make a favicon for the sites I’m handling lately. I’m sure this will impress my boss. Thanks and I wish you all the best.