HTML favicon

HTML Tutorial

HTML Forms

HTML Graphics

HTML Media

HTML API

HTML Favicon

How To Add a Favicon in HTML

Any image you like can be used as your favicon. You can also create your own favicon on sites like https://www.favicon.cc.

A favicon image is displayed to the left of the page title in the browser tab, like this:

To add a favicon to your website, either the favicon image is saved to the root directory of the web server, or a folder is created in the root directory called images, and save your favicon image in this folder. A common name for a favicon image is “favicon.ico”.

Next, add a <link> element to your “index.html” file, after the <title> element, like this:

Example

				
					<!DOCTYPE html>
<html>
<head>
  <title>HTML favicon</title>
  <link rel="icon" type="image/x-icon" href="/images/favicon.ico">
</head>
<body>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
</body>
</html>

				
			

Output:

html favicon