From the course: Learning Responsive Media

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Using icon fonts

Using icon fonts

From the course: Learning Responsive Media

Start my 1-month free trial

Using icon fonts

By embedding fonts into our webpages, we have greater control over the typography in them. Beyond traditional fonts like letters and numbers like you'd expect, there are also typefaces known as icon fonts, like the dingbat fonts included on many of our computers. Those fonts have icons instead of letters or numbers. Storing icons in font files means that we can embed them into web pages to get a number of benefits. We can change colors like we change font colors. We can change their size and still maintain their crispness. We can even add shadows to icons with text shadow property and so on. In short anything you can do in CS to style text, you can also do to icon fonts. There are plenty of free icon fonts available on the web. One of the popular icon fonts is called Font Awesome. You can easily download and install the font locally on your computer and then move the files to your asset folder for your site. For this example though, I want to use a CDN hosted service for the reference…

Contents