Free HTML tutorial

HTML Favicon: Add a Site Icon

Learn how to add a favicon with a link element in the document head and choose an icon file for your website.

What a favicon is

A favicon is an icon associated with a website. Browsers may show it in tabs, bookmarks or other browser interface areas.

Link an icon in the document head

Use a <link> element inside <head>. A root-relative path can point to an icon at the website root.

<head>
  <meta charset="utf-8">
  <title>Example page</title>
  <link rel="icon" href="/favicon.ico">
</head>

The rel="icon" value identifies the resource as a site icon. The href gives its URL. Browsers support common icon formats; check the requirements of the browsers and platforms your site serves.

A favicon may appear next to a page title in a browser tab.

← HTML images Next: HTML page title →