HTML & CSS Wiki
Register
Advertisement

A favicon (short for favorites icon), also known as a shortcut icon, website icon, URL icon, or bookmark icon is a 16×16 or 32×32 pixel square icon associated with a particular website or webpage. The favicon of this wiki is 20100820192622!Favicon.png. Favicons are usually an ICO-type images, but any type of image can be linked to, as a favicon. It is better to have an ICO image as a favicon so it will have a higher chance to be rendered properly. Browsers that provide favicon support typically display a page's favicon in the browser's address bar which is next to the page's name in a list of bookmarks. Browsers that support a tabbed document interface typically show a page's favicon next to the page's title on the tab.

Favicons are linked to the web page using the HTML <link /> element.


Here is an example of what the favicon looks like on a tab bar: Favicon Example

Browser Support

Browser ICO PNG GIF animated GIFs JPEG APNG SVG
Google Chrome Yes 4.0 4.0 No 4.0 No No
Internet Explorer 4.0 8.0 No No 8.0 No No
Mozilla Firefox Yes Yes Yes Yes Yes 3.0 No[5]
Opera Yes Yes Yes Yes Yes Yes 9.6
Safari Yes 4.0 4.0 No 4.0 No No

Usage

The following format is cross-browser compatible and is supported by Internet Explorer, Firefox, Chrome, and Opera.

  • <link rel="icon" href="http://www.example.com/myicon.ico" />
    

The following is also acceptable:

  • <link rel="icon" href="/somepath/myicon.ico" />
    

You can also use any type of image as a favicon:

  • <link rel="icon" href="/somepath/BG.png" />
    
    or
    <link rel="icon" href="/somepath/Logo.gif" />
    

Create your own favicon

Advertisement