blogHome

Icon Fonts – Responsive

January 5th, 2013

Now that we’re developing web applications for so many screen sizes and resolutions it’s critical that we design interfaces with icons that display properly across the board. Today, the best option is to leverage fonts with scalable icons as their characters.

It’s important to understand which browsers support @font-face. Check browser support for @Font-Face.

Here are my favorite top quality icon fonts.

Font Awesome

Font Awesome’s icon font is my current favorite set. Font awesome was designed to work with Twitter’s Bootstrap framework but also works well with Zurb’s Foundation and can be implemented on just about any HTML website.

Font Awesome

Font Awesome is a fantastic font icon set designed to create scalable icon fonts for any website. The icon set contains icons for Web Applications, Text Editors, Directionals, Video Players, Social and Media interfaces.
Font Awesome
Date published: 01/05/2013
5 / 5 stars

View Font Awesome


IcoMoon

IcoMoon has taken the icon fonts to a new level by providing a library of over 1800 icons and the means of creating a custom font based on your needs. The benefit to a customized approach reduces the load on the server by providing only fonts used by the site. They also allow custom vector icons.

IcoMoon

IcoMoon is a super flexable custom font solution. They provide both free and paid solutions depending on the need of your project.
IcoMoon
Date published: 01/05/2013
5 / 5 stars

View IcoMoon


Foundation Icons Fonts – Zurb

Zurb is the founders of Foundation a responsive framework. They created a free icon font set. Their set isn’t as robust as some of the other sets out there but the quality and documentation make the implementation easy. They work and look great.

Foundation Icon Font by Zurb

Zurb’s Foundation Icon Font is a super simple solution to getting up and running with font icon sets.
Foundation Icon Font
Date published: 01/05/2013
4 / 5 stars

View Foundation Icons Font


Leave A Comment