How to Create a Favicon

Est. Read Time: ~Keurig Brew-Time

Ever wonder about the icons some sites have that show in the tab or when you have a bookmarks bar?  Well here is a quick guide to how you can create your own.

Step 1. Generating the icon

There is not a specific generator that I stick to every time. I normally just Google ‘Favicon Gen’ to find an icon generator.  Here is a list of a few that I know work:

IMPORTANT: You want to pick the 16×16 pixels version vs. any other sizes.  IE will not show favicons that are the 32 or 64.

Step 2. Placing it on the page

Update the following code with the path to the icon and place it in the head of your document.

<link href="/global/images/favicon.ico" rel="Shortcut Icon" type="image/x-icon"/>

NOTE: Browsers cache these icons so you may have to clear your cache to see a change. Thats it!