Last Updated: February 25, 2016

Convert your favourite pic to favicon

In this lesson I show you how to upload your favourite pic (PNG JPG GIF or anytype of image) into favicon (ICO) so it can be embeded in your website. So rather edittin your pic in Photoshop you simple have to upload it,download the ico file,then embed it in your website. We will be using favigen web app to convert our picture into favicon.

Note: the result may be not perfect as you wish. If you want your favicon to be perfect. little Photoshop skill may required. It isn't hard as you think,you can search in Youtube

STEPS

Fire up your favourite browser
Goto favigen.com
Upload your favourite image you want to convert as favicon (.ICO)
Chose the Favicon Size, the choice are:
- 16 pixels
- 32 pixels
- 64 Pixels

In this case we chose 16px because we just want to embed it in our website.

Click the "3) Create Favicon Button"
Message will show up

"Your favicon has been generated. You can right-click the icon to save it or just hit the download button now."

Congratulations, you successfully converted your pic into favicon,now its time to download your favicon.

Now just click the "Download your favicon" to download your favicon.
Upload the downloaded icon into your hosting service
Now we can embed the code,Put the html code inside the <head> tag

<link rel="shortcut icon" type="image/x-icon" href="favicon.ico">

Don't forget to change the href value into the icon path.

NOTE: You can embed it in your local server using Firefox , but not for Chrome. Chrome can't display your favicon if you are working in local server except your server is online. But Firefox can display your favicon wether you working in hosting service service or local server.

#tuts