What's a favicon?

Favicons (a portmanteau of the words "favourite" and "icon") made their debut as those icons that would pop up in the bookmarks section of web browsers; the first being Internet Explorer.1

With all kinds of browsers and smart devices accepting these favicons, the size requirements are vastly more complicated than the traditional *.ico file.

Size and format requirements

Added on 28 January 2018

Since the time of writing, Google's icon requirements page has been removed and the MacBook Pro touch bar was introduced. I have also found the RealFaviconGenerator tool to provide a more comprehensive favicon output that covers a few more possibilities.

Google's Web Fundamentals had a page dedicated to providing great icons and tiles which included things like bookmark icons and Windows Metro.

According to this only the following formats are required as a minimum:

A generator such as Favic-o-Matic can be used to generate the icons and HTML that is used to reference the various favicon options that are enabled.

Footnotes

  1. The History of the Web: How we got the favicon, by Jay Hoffmann, details a lot of interesting information, including the history of the favicon. ↩