« Previous Next »

Favicon

A favicon (short for "favorite icon") is a small icon that appears in the browser tab, bookmarks, and shortcuts. It helps users visually identify your website.

How to Add a Favicon

Include the following <link> tag inside the <head> section of your HTML document: 

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

Favicon File Notes

  • The favicon file is usually named favicon.ico and placed in the root directory.
  • You can also use .png, .svg, or .gif formats, but .ico is the most universally supported.
  • Recommended sizes are 16x16 or 32x32 pixels.

Example Using PNG

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

Best Practice

Save the favicon in the same folder as your index.html file to avoid broken paths.

Advanced Tip

For full support on all devices and platforms, generate a favicon set using: https://realfavicongenerator.net/

Example

Output :
« Previous Next »