What is favicon image

Favicon is a really small icon image usually represents your company’s brand and identity, give a sense of complete blog design to your viewers and a good seo practice. You will see these nitty gritty icons in browser address bars, tabs, bookmark lists and even search history.

Why not create favicon for your own blog?

Favicon is a short form of “Favorites Icon”.

Woopoo's Tip


1. How to Design Favicon

You can hire a favicon designer but why not give it a try yourself and create favicon for free. See the points below for a good favicon design.


Whatever software you use, start with a big square canvas. We will resize it to favicon size 16×16 pixels. You can’t design anything on a 16×16 pixels box, it will be too tiny.


Always use bright contrast colors.


If you are using logo as favicon, make it as big as possible to cover the whole area.


A text based favicon should be only one letter with bold font or maximum three characters.


Point is to make it visible and readable even on a 16×16 canvas.

2. How to Create Favicon.ico

The only pitfall comes to save your design as an “.ico” file because favicon code needs an ico file instead of jpg, png which are common image formats. We will discuss three ways to generate favicon.ico from your artwork.



Creating a favicon in Photoshop is a bit techy as Photoshop doesn’t have native support to save an ico file. One solution is to use a plugin from http://telegraphics.com.au/sw/product/ICOFormat although this plugin has some bugs but serving the purpose.



Irfanview is a versatile free image handling software. Open your image in IrfanView and go to Image->Resize, change size to 16×16 pixels and then from Save As dialog, choose ico and save.

Darn! your are done.


Online Favicon Maker

There are many websites which offer free favicon from your artwork. You will just feed them your jpg file and they will create favicon online.

For example, visit http://www.favicon-generator.org/, the website has a very simple interface, just click Choose File and give them your image file, must be a square image. Select the option “Generate only 16×16 favicon.ico”.Click Create Favicon and select favicon.ico download option. Thats it! Job done.

3. How to Add Favicon to WordPress

Adding favicon to wordpress blog is just a click away. WordPress versions 4.3 and later have this option built in.

From Dashboard, go to Appearance -> Customize and Site Identity.

Under Site Icon, Click Select Image and upload ico file. You can even select an image with resolution upto 512 pixels.

Always prefer an ico file because it is really fast to load and have higher compatibility with older browsers.

Woopoo's Tip

4. Favicon WordPress Plugin

Although not required but just as an option, you can use All In One Favicon to show up your favicon. Simply install it and it will let you upload the favicon.

5. Favicon Examples

See the favicon gallery below to get favicon ideas


Before designing anything for your blog, do a bit of research and see how big brands favicons have really simple designs.

Gimme a Share pleeeaase!

Pin It on Pinterest

Share This