CSS Icons:
In this article, we will know how to use the CSS icons to add to the HTML page from the icon library. All the icons in the library can be formatted using CSS. They can be customized according to size, color, shadow, etc. The icon is a graphical representation that conveys the specific meaning for which it is used & helps to navigate accordingly.
There are 3 types of icon libraries available, namely
👉Font Awesome Icons
👉Google Icons
👉Bootstrap Icons
Syntax:
<i class="fa fa-cloud"></i>
Example:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet"
href=
"https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
<body>
<h1>Unique beauty</h1>
<i class="fa fa-cloud"
style="font-size:32px;">
</i>
<i class="fa fa-heart"
style="font-size:32px;">
</i>
<i class="fa fa-Rose"
style="font-size:32px;">
</i>
<i class="fa fa-car"
style="font-size:32px;">
</i>
<i class="fa fa-file"
style="font-size:32px;">
</i>
</body>
</html>
Output:
Unique beauty
☁♡🌹🚗📄
