freeCodeCamp/guide/english/bootstrap/fontawesome-icons/index.md

1.4 KiB

title
Fontawesome Icons For Bootstrap

Fontawesome Icons For Bootstrap

Bootstrap (from version 4 onwards) have dropped Glyphicon icons font in their latest release. Fontawesome Icons provide you with over 675 icons and they come in font format.

How To Use:

In the <head> of your html include a reference to Font Awesome.

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">

Using fontawesome is same as using Glyphicon.

Simply create <i> or <span> tag and apply the CSS Prefix fa and the icon's name. A code example has been provided below.

Code Example:

<i class="fa fa-twitter" aria-hidden="true"></i>

<span class="fa fa-freecodecamp" aria-hidden="true"></span>

Fontawesome Icon List:

Complete list of icons provided by fontawesome is available here

.fa fa-align-left This is fontawesome align left icon.

.fa fa-heart This is fontawesome heart icon.

Note: Do not include the dot in the HTML Class Attribute, referring to the classes with a dot is only used when adjusting the classes in CSS.

More Information:

Fontawesome Cheatsheet