How to Add a Favicon in Html

If we want to add a favicon in Html document which is to be shown at just before the title of the page in the browser, we have to follow the steps which are given below. Using these steps, we can easily add a favicon.

Step 1: Firstly, we have to create a favicon which we want to add in the Html document. So, using the https://www.favicon.cc/ link, we can create a favicon.

Step 2: When we get the favicon successfully, then we have to download it by clicking on the download favicon option.

Step 3: Now, copy the downloaded favicon and save it to that location where the Html document is saved.

Step 4: Now, we have to type the Html code in any text editor or open the existing Html file in the text editor in which we want to add a favicon.

Step 5: Now, we have to place the cursor in the head tag of the Html document and then define the <link> tag just after the closing of title tag as shown in the following block. And then, we have to use the attributes of link tag within the <link> tag.

Step 6: And, at last, we have to save the Html document and then run it.

The following screenshot shows the output of the above Html code: