How to Add Favicons on Blogger Blogs

Last week I was really itching to change my blog template but I had to stop myself coz I really like this existing template. It's clean and uncluttered and doesn't take ages to load. So instead of messing with my theme, I decided to add a personalized touch to all my blogs with favicons. The blogger favicon looks so generic and if you want to have your blog standout from bookmarked sites then use favicons.

A "favorite icon" or favicon (pronounced fav-eye-con) is a 16x16 pixels icon that appears next to a website's URL in the address bar of a web browser. Browsers that support favicons may display them in the browser's URL bar, next to the site's name in lists of bookmarks, and next to the page's title in a tabbed document interface.

Setting up your favicon is really easy and with these easy steps you'll have your own favicon up in mere minutes.

1. Make your own icon. You can make it from scratch using photo editing/graphic softwares or you may use these favicon generators:
  • GenFavIcon - upload our chosen image and you'll be able to generate16x16, 32x32, 48x48, 64x64 and 128x128 and can be saved in ico and jpg format.
  • FavIcon from Pics - create icons and marquees for your web pages, can save in ico format.
  • Dynamic Drive - supports gif, jpg, png, and bmp and generates .ico format images.
  • Favicon.co.uk - .ico file from any image on your computer in 16x16, 32x32, 48x48, 64x64 image sizes.
  • Favicon.cc - import an image or paint your own! generates ico file format images plus you have the option to publish your work.
  • GraphicsGuru
  • DagonDesign - lets you upload an image (JPG, PNG, or GIF - 100KB max), and easily convert it to a standard 16x16 favicon.ico file for display on your website.
  • 256 pixels - upload an image or start from scratch. their daily favicon challenge make it more interesting.
  • webscriptlab - upload an image (png, jpg,gif or png - 150 kb max) and convert it to 16x16 or 32x32 ico file format.
  • Somacon - draw your own and create a 16x16 pixel icon in 16 colors with optional transparency.
  • favicongenerator - image for uploading must be square. generates ico file format images.
  • antifavicon - Favicons generated here contain text instead of images in order to be descriptive.
  • iconj - free generator and .ico file hosting.
  • Prodraw - allows jpg, gif, jpeg, png, bmp, tif, tiff less than 1 mb. Output size from 16x16 pixels , 32x32 , 48x48 up to 128x128 pixels in the *.ICO icon format. Also generates icons with different sharpen levels to let you compare with and download.
  • Faviconexpert - Image includes scrolling text option.
  • Ajaxload
2. Once you have your icon image ready, host it somewhere (free filehosting is everywhere :P).

3. Go to your blog template and after the tag, head



add this code:

If the your favicon file format is .ico, use this code:


If the your favicon file format is .jpg/gif/png, use this codes:









Post a Comment

1 Comments

Kat said…
This is great! I always wanted to change the Blogger favicon on my blog, especially when I move to my own domain. :)