- Home
- Icon Tutorial
- Font Awesome
- Font Awesome Photo Icon
- Font Awesome Pie-chart Icon
- Font Awesome Plane Icon
- Font Awesome Plug Icon
- Font Awesome Plus Icon
- Font Awesome Plus-circle Icon
- Font Awesome Plus-square Icon
- Font Awesome Plus-square-o Icon
- Font Awesome Power-off Icon
- Font Awesome Print Icon
- Font Awesome Puzzle-piece Icon
- Font Awesome Qrcode Icon
- Font Awesome Question Icon
- Font Awesome Question-circle Icon
- Font Awesome Quote-left Icon
- Font Awesome Quote-right Icon
- Font Awesome Random Icon
- Font Awesome Recycle Icon
- Font Awesome Refresh Icon
- Font Awesome Registered Icon
- Font Awesome Remove Icon
- Font Awesome Reorder Icon
- Font Awesome Reply Icon
- Font Awesome Reply-all Icon
- Font Awesome Retweet Icon
- Font Awesome Road Icon
- Font Awesome Rocket Icon
- Font Awesome RSS Icon
- Font Awesome RSS-square Icon
- Font Awesome Search Icon
- Font Awesome Search-minus Icon
- Font Awesome Search-plus Icon
- Font Awesome Send Icon
- Font Awesome Send-o Icon
- Font Awesome Server Icon
- Font Awesome Share Icon
- Font Awesome Share-alt Icon
- Font Awesome Share-alt-square Icon
- Font Awesome Share-square Icon
- Font Awesome Share-square-o Icon
- Font Awesome Shield Icon
- Font Awesome Ship Icon
- Font Awesome Shopping-cart Icon
- Font Awesome Sign-in Icon
- Font Awesome Sign-out Icon
- Font Awesome Signal Icon
- Font Awesome Sitemap Icon
- Font Awesome Sliders Icon
- Font Awesome Smile-o Icon
- Font Awesome Soccer-ball-o Icon
- Font Awesome Sort Icon
- Font Awesome Sort-alpha-asc Icon
- Font Awesome Sort-alpha-desc Icon
- Font Awesome Sort-amount-asc Icon
- Font Awesome Sort-amount-desc Icon
- Font Awesome Sort-asc Icon
- Font Awesome Sort-desc Icon
- Font Awesome Sort-down Icon
- Font Awesome Sort-numeric-asc Icon
- Font Awesome Sort-numeric-desc Icon
- Font Awesome Sort-up Icon
- Font Awesome Space-shuttle Icon
- Font Awesome Spinner Icon
- Font Awesome Spoon Icon
- Font Awesome Square Icon
- Font Awesome Square-o Icon
- Font Awesome Star Icon
- Font Awesome Star-half Icon
- Font Awesome Star-half-empty Icon
- Font Awesome Star-half-full Icon
- Font Awesome Star-o Icon
- Font Awesome Sticky-note Icon
- Font Awesome Sticky-note-o Icon
- Font Awesome Street-view Icon
- Font Awesome Suitcase Icon
- Font Awesome Sun-o Icon
- Font Awesome Support Icon
Font Awesome Sliders Icon
Usage
<i class="fa fa-sliders"></i>
Out of the box
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
</head>
<body>
<i class="fa fa-sliders"></i>
</body>
</html>
Live Demo
Large Icon
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
</head>
<body>
<i class="fa fa-sliders fa-5x"></i>
<!--use the fa-lg (33% increase), fa-2x, fa-3x, fa-4x, or fa-5x classes-->
</body>
</html>
Live Demo
Change color
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
<style type="text/css">
.fa_custom {
color: #0099CC
}
</style>
</head>
<body>
<i class="fa fa-sliders fa_custom"></i>
<i class="fa fa-sliders fa_custom fa-2x"></i>
<i class="fa fa-sliders fa_custom fa-3x"></i>
<i class="fa fa-sliders fa_custom fa-4x"></i>
</body>
</html>
Live Demo
Previous: Font Awesome Sitemap Icon
Next:
Font Awesome Smile-o Icon
- Weekly Trends and Language Statistics
- Weekly Trends and Language Statistics