Using icon fonts
In this recipe, the usage of icon fonts for your projects is discussed. As the name suggests, icon fonts are sets of icons defined as a font. Icon fonts can replace image icons in your projects. The main reason for using icon fonts instead of images and the reason they are discussed here is that icon fonts, just like any normal font, can be fully manipulated with CSS. In your project, you can set the size, color, and shadows of the used icon fonts with Sass. The primary reason for using icon fonts is to benefit the load time of your website; similar to sprite images, but with more styling options, only one HTTP request is needed to load them all. Icon fonts will look good on different resolutions and displays too. In this recipe, you will learn how to use the Font Awesome iconic font and toolkit with Sass.
Getting ready
Read the Installing Sass for command line usage recipe of Chapter 1, Getting Started with Sass, to find out more about installing Sass and get the Ruby Sass...