Searching....
Search Results
Font Awesome Exclamation Circle (Error, Warning, Attention)
The Font Awesome exclamation circle icon can be used to indicate errors, warnings, or attention messages, such as validation errors, alerts, or notifications. You can easily insert this icon into your HTML code by using the class fa fa-exclamation-circle for version 4 and fas fa-exclamation for version 5
Fontawesome Version 4.X
exclamation circle
<i class='fa fa-exclamation-circle'></i> exclamation circle
<i class='fa fa-exclamation-circle' style='color: white'></i> exclamation circle
<i class='fa fa-exclamation-circle' style='color: red'></i> exclamation circle
<i class='fa fa-exclamation-circle' style='color: blue'></i> exclamation circle
<i class='fa fa-exclamation-circle' style='color: #f3da35'></i> Fontawesome Version 5.X
exclamation circle
<i class='fas fa-exclamation-circle'></i> exclamation circle
<i class='fas fa-exclamation-circle' style='color: white'></i> exclamation circle
<i class='fas fa-exclamation-circle' style='color: red'></i> exclamation circle
<i class='fas fa-exclamation-circle' style='color: blue'></i> exclamation circle
<i class='fas fa-exclamation-circle' style='color: #f3da35'></i> How to add Font Awesome exclamation circle Icon ?
Font Awesome Icon fa fa exclamation circle Icon can be added to any web page simply as below. You can integrate Icon in web pages by just adding following below syntax & icon code.
HTML Code
Get complete html code for icon exclamation circle
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
<link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css'>
</head>
<body>
<i class='fa fa-exclamation-circle'></i>
</body>
</html> Tags
bellow,call,clamor,cry,interjection,ring ,exclamation, error , warning, attention ,alerts,notification,validation
Change Font Awesome Icon Exclamation circle Color
Sometimes we need icons in different color, as we suggested by adding css style we can change color. Here we have created one example to change color of icons with css classes.
<style>
.blue-color {
color:blue;
}
.green-color {
color:green;
}
.teal-color {
color:teal;
}
.yellow-color {
color:yellow;
}
.red-color {
color:red;
}
</style>
<i class='fa fa-exclamation-circle blue-color'></i>
<i class='fa fa-exclamation-circle green-color'></i>
<i class='fa fa-exclamation-circle teal-color'></i>
<i class='fa fa-exclamation-circle yellow-color'></i>
<i class='fa fa-exclamation-circle red-color'></i>
Note- Make Sure You have included the below Font Awesome file in header-
<link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css'>
Advertisements
Advertisements