Font Awesome CDN 4.7, 5.15, 6.5

<!DOCTYPE html>
<html lang="en">
<head>
    <link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css'>
</head>

<body>
    <h3>How to use font awesome icons cdn</h3>
    <div><i class="fa fa-envelope"></i> - envelope icon</div>
    <div> <i class="fa fa-phone"></i> - phone icon</div>
    <div> <i class="fa fa-search"></i> - search icon</div>
    <div><i class="fa fa-shopping-cart"></i> - shopping cart icon</div>
    <div> <i class="fa fa-user"></i> - user icon</div>
    <div> <i class="fa fa-heart"></i> - heart icon</div>
    <div><i class="fa fa-play"></i> - play icon</div>
    <div> <i class="fa fa-cog"></i> - cog/gear icon</div>
    <div><i class="fa fa-trash"></i> - trash icon</div>
    <div> <i class="fa fa-check"></i> - checkmark icon</div>
</body>
<style>
    /* set the font-size of all icons to 24px */
    .fa {
        font-size: 24px;
    }

/* add some margin to the left of the icon elements */
    div>.fa {
        margin-right: 5px;
    }

/* style the text in the div elements */
    div {
        display: flex;
        align-items: center;
        font-size: 18px;
        margin-bottom: 10px;
        color: #333;
    }

/* change the color of the envelope icon to red */
    .fa-envelope {
        color: red;
    }

/* change the color of the phone icon to green */
    .fa-phone {
        color: green;
    }

/* change the color of the search icon to blue */
    .fa-search {
        color: blue;
    }

/* change the color of the shopping cart icon to orange */
    .fa-shopping-cart {
        color: orange;
    }

/* change the color of the user icon to purple */
    .fa-user {
        color: purple;
    }

/* change the color of the heart icon to pink */
    .fa-heart {
        color: pink;
    }

/* change the color of the play icon to black */
    .fa-play {
        color: black;
    }

/* change the color of the cog/gear icon to gray */
    .fa-cog {
        color: gray;
    }

/* change the color of the trash icon to brown */
    .fa-trash {
        color: brown;
    }

/* change the color of the checkmark icon to teal */
    .fa-check {
        color: teal;
    }
</style>

</html>

xxxxxxxxxx
 
<!DOCTYPE html>
<html lang="en">
<head>
    <link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css'>
</head>
​
<body>
    <h3>How to use font awesome icons cdn</h3>
    <div><i class="fa fa-envelope"></i> - envelope icon</div>
    <div> <i class="fa fa-phone"></i> - phone icon</div>
    <div> <i class="fa fa-search"></i> - search icon</div>
    <div><i class="fa fa-shopping-cart"></i> - shopping cart icon</div>
    <div> <i class="fa fa-user"></i> - user icon</div>
    <div> <i class="fa fa-heart"></i> - heart icon</div>
    <div><i class="fa fa-play"></i> - play icon</div>
    <div> <i class="fa fa-cog"></i> - cog/gear icon</div>
    <div><i class="fa fa-trash"></i> - trash icon</div>
    <div> <i class="fa fa-check"></i> - checkmark icon</div>
</body>
<style>
    /* set the font-size of all icons to 24px */
    .fa {
        font-size: 24px;
    }
​
    /* add some margin to the left of the icon elements */
    div>.fa {
        margin-right: 5px;
    }
​
    /* style the text in the div elements */
    div {
        display: flex;
        align-items: center;
        font-size: 18px;
        margin-bottom: 10px;
        color: #333;
    }
​
    /* change the color of the envelope icon to red */
    .fa-envelope {
        color: red;
    }
​
    /* change the color of the phone icon to green */
    .fa-phone {
        color: green;
    }
​
    /* change the color of the search icon to blue */
    .fa-search {
        color: blue;
    }
​
    /* change the color of the shopping cart icon to orange */
    .fa-shopping-cart {
        color: orange;
    }
​
    /* change the color of the user icon to purple */
    .fa-user {
        color: purple;
    }
​
    /* change the color of the heart icon to pink */
    .fa-heart {
        color: pink;
    }
​
    /* change the color of the play icon to black */
    .fa-play {
        color: black;
    }
​
    /* change the color of the cog/gear icon to gray */
    .fa-cog {
        color: gray;
    }
​
    /* change the color of the trash icon to brown */
    .fa-trash {
        color: brown;
    }
​
    /* change the color of the checkmark icon to teal */
    .fa-check {
        color: teal;
    }
</style>
​
</html>