Font icons are a great alternative to images for things like social media icons, buttons and list decoration. They're scalable, light-weight, accessible and can easily be customized with CSS to change their color, size, drop shadow etc.

Getting Started

All Sitecore sites currently have access to Font Awesome 4.7.0.

Full v4.7 Icon List

You can place Font Awesome icons just about anywhere using the CSS Prefix fa and the icon's name. Font Awesome is designed to be used with inline elements (we like the <i> tag for brevity, but using a <span> is more semantically correct).

<i class="fa fa-camera-retro"></i>

Example results:

Want your icon a little bigger? Font Awesome comes equipped with a number of classes to increase the size of your icon.

<i class="fa fa-camera-retro fa-3x"></i>

Example results:

More examples and tips can be found on the Font Awesome examples page. Please note some examples featured on the Font Awesome site rely on the Bootstrap CSS framework which is not available in Sitecore. If you have questions on how to customize the style of your icons please contact Web Services.