HTML favicon

14 May 2024

Advanced

1.52K Views

3 min read

HTML favicon

HTML favicon is a small file that contains one or more icons representing the website or a blog. Favicon is also known as a tab icon, website icon, URL icon, or bookmark icon.

The HTML Favicon icon is displayed on the address bar of the web page, at the browser's tab, in browser history, bookmark bar, etc. The image format of a favicon is .ico file format. Various file formats are available, but the .ico format is supported by every browser. There are many features other than Favicon which you can learn with the help of HTML Online Training.

How to Create a Favicon in HTML

These are the following steps for creating the favicon:

Click on the given URL, to make the favicon: https://www.favicon.cc/
When the favicon is created successfully, we can download the favicon by clicking on the download favicon option.
After downloading, the favicon with the name favicon.ico is available in the file system drive.

Read More:- HTML Interview Questions and Answers

How to add Favicon in HTML

These are the following steps to let you know How to add favicon in HTML file:

Open the HTML file. Then use the given syntax to insert the favicon in the HTML file.

Syntax:

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

This syntax must be used in our HTML file. Then we have to save the file.
Now. You can open the HTML file in any browser. We will see the icon on the web page.

Example

<html> 
<head> 
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon"> 
</head> 
<title> favicon html code </title> 
<body> 
<br> 
<br> 
<p align="center"> 
<img src="image.jpg"> 
</p> 
</body> 
</html>

Summary

HTML favicon can improve the user experience by making it easier to identify and differentiate between different websites in the browser. They can also help in branding a website by displaying a logo or other distinctive image. In this article, we learned what is Favicon and how can we create a favicon HTML code in order to make an attractive website and better user experience

Learn more in our HTML Certification Course.