How to add an Icon to the HTML page?

Today we will learn how to put an icon on an HTML page and use it, or how to add an icon to an HTML page. Here are some steps.
I think you should have an idea of how to add an icon.

Step 1:- Create HTML Structure and add Font Awesome link

Font Awesome can be added in two ways like putting an online CDN link and adding an icon on the HTML page or you can use it by downloading offline Font Awesome.

• Font Awesome link can be added in two ways
  1. Direct online Font Awesome CDN link add.
  2. Font Awesome Download it then adds an offline link.

Now let’s see how to add a Font Awesome link online

Open this ( https://cdnjs.com/libraries/font-awesome ) page and copy first link all.min.css copy it. and past your HTML page.

Step 2:- Open font Awesome and copy the icon code after the search icon name and paste it into your HTML page.

Output:-

How to download Font Awesome and add a link to an offline HTML page?

https://fontawesome.com/ Open this page and click the start for a free button then click on the new page click on the download button and open a new tab then choose your Font Awesome Version: 5.15.3 and click Download Awesome Free Download For web button.

Why the icon is used?

Icons can be used for social media lists and can also be used to make our HTML design more attractive so that the design looks better. I have given an example of an icon below.

<i class="fab fa-facebook-f"> Facebook </i>
<i class="fab fa-youtube"> Youtube</i>
<i class="fab fa-instagram">Instagram</i>