HTML Favicon

A favicon is a small icon shown in the browser tab.
It helps identify a website visually.

Adding a Favicon

Favicons are added inside the <head> section.

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

Using PNG Favicon

<link 
  rel="icon"
  href="favicon.png"
  type="image/png"
  sizes="32x32">

Attributes Used

  • rel → relationship type
  • href → icon file path
  • type → file format
  • sizes → icon size

Important Notes

  • Place favicon in root or correct folder
  • Clear browser cache if favicon does not update
  • Use square images