Font Awesome Overview
Overview
Font Awesome is designed to be used with inline elements
i em or span
two bits of information to reference an icon,
two bits of information to reference an icon,
- its name, prefixed with fa-
-
the style you want to use’s corresponding prefix.
- solid (fas fa-clock )
- regular(far far fa-clock)
- brand (fab fa-facebook)
- two version free and pro
- Items are sized by the class fa-sm to fa-7x using the inhernit size
- Animated icons: use the class fa-spin and fa-pulse
- Rotated and Flipped Icons: The fa-rotate-* and fa-flip-* classes are used to and flip icons
- stack multiple icons (to combine icons), use the fa-stack class on the parent
fa-twitter (inverse) on fa-circle (solid)
fa-ban on fa-camera -
Fixed Width Icons: icon have different width use fa-fw to enforce fixed widths ie for vertically aligned menus
SkatingSkiingNordic SkiingSnowboardingSnowplow
-
icon lists: to use icons as bullets in list use Fa-ul and fa-li
- List icons can
- be used to
- replace bullets
- in lists
- Bordered + Pulled Icons: wrap text around an icon or give it some visual distinction with a border. use fa-border, fa-pull-right or fa-pull-left Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
- Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
References
Sizeing examples
Icons inherit the font-size of their parent container which allow them to match any text you might use with them. With the following classes, we can increase or
decrease the size of icons relative to that inherited font-size.
xs sm lg 2x sm sm sm vsm
Common examples
twitter
twitter square
Facebook
twitter
Google Reddit Google Google
bell Comment Comment Comments
Phone bell calendar keyboard
wallet receipt coins donate
cloud umbrella wind sun
Google Reddit Google Google
bell Comment Comment Comments
Phone bell calendar keyboard
wallet receipt coins donate
cloud umbrella wind sun