how to create account on font awesome 5 and add icons in html page. full guide with images source code and videos.

Why Font Awesome :

Font Awesome is one of the most popular way to add icons in html page. font awesome icons are used frequently in the web developer community because of their simplicity to add icons and there is a lot of icons of each category it can be navbar icons, settings-related icons, vehicles, travel, brands, objects, etc.

  

Registration:

 here we are going to do how to add awesome fonts icons in html page, first of all, go to Font awesome site. here you can see a button"start for free" click it.



now you are on another window, here they are asking for a Gmail address, simply enter an email address then click "send kit code".


 A
fter that they will send a Gmail for confirmation, go to your Gmail and you will see an email from Font Awesome open email. now you have a button "click to confirm your email address".after that, they will ask for your password and name. now registration phase is over and you are able to add icons in HTML page.



How to add icons:

 After registration, a kit code will be provided to you simply copy and paste it in your html file in the head tag.


now go to at the bottom of the home page you will see lots of categories select one of them and choose icon what do you want to add to your project.



you can see a button" start using this icon " click it. then copy code and paste into html file.


source code:  

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Font testing</title>
   <!-- ADD KIT CODE HERE -->
<style>
    body{
        displayflex;
        width100vw;
        height100vh;    
        justify-contentcenter;
        align-itemscenter;
    }

</style>
</head>
<body>
        <i class="fas fa-address-card"></i>
</body>
</html>

Output:

WATCH VIDEO :

In this video, everything is described less than one minute.


detailed video everything described step by step.

download source code


  

Post a Comment

0 Comments