One development in web design in the last year that I have found really handy is fonts which are made up of icons which you can include your WordPress themes. No longer do you have to cut out individual fonts as images, using a font icon is a much better way to use them in your designs as you include the font once using @fontface and then have access to a whole range of different icons which can be scaled to any size as fonts are vector files.
There are a number of sets you can download for free and use in your themes which I will cover today.
Font Awesome
In a single collection, Font Awesome is a pictographic language of web-related actions. Designed from scratch to be fully backwards compatible with Twitter Bootstrap 2.0.
Modern Pictograms
Modern Pictograms is a typeface for interface designers and programmers. Designed in early 2011 for the Flatfile WordPress theme, the pictograms stay sharp when used large or small.
Web Symbols Typeface
We want creative people to spend time on creative things. So we came up with the typeface that includes all frequently used iconographics and symbols.
Foundation Icon Fonts 2
Custom icon sets that are stored in a handy web font and are coded to be more accessible. A couple lines of CSS and the right markup will get you going in no time.
Pictonic
Over a thousand beautifully hand-crafted icons for every possible occasion – 280 Free + 2000 more for $99.
Sosa
Sosa includes the 120+ icons I have found most useful. The download includes the .ttf .eot .svg & .woff files need to use this icon font via @font-face.
Iconic
Iconic aims to be the most forward-thinking icon set around based on its support of forward facing display/deployment methods. Icons should not just be clear and attractive, they should be easy and flexible to work with.
iKoo
ikoo typo is a font specially developed to be integrated into an html page without using images via @FontFace (or other). Customize the color and size by css. You can also use ikoo font for your web page design on photoshop or fireworks.
Heydings Icons
Heydings Icons. It’s a fairly modest collection of 60 glyphs specifically intended for the accessorization and classification of textual cues such as hyperlinks, navigation elements and buttons.
Heydings Controls
Heydings Controls was designed as a sort of ‘expansion pack’ for Heydings Icons and covers a number of interactive controls ommitted from the original.
Brandico
Font with logos of social services & messagers.
Typicons
Typicons are free-to-use vector icons embedded in a webfont kit for easy use in your UI, whether it be on the web or in a native application.
Entypo Pictogram Suite
Entypo is a set of 250+ carefully crafted pictograms. The package contains an icon font — OpenType, TrueType and @font-face — EPS, PDF and PSD files. All released for free under the license CC BY-SA 3.0.
Just Vector Social Icons Set
The whole icon set is huge. So I’ll keep all versions I make around just in case the icon you’re looking for is in one of them. The main ones (Twitter, Facebook, Tumblr, etc.) will be on all versions of the set.
Signify Lite
Exclusive to MediaLoot, bring scalable and flexible graphics to the web with CSS @font-face and the new Signify Lite free icon font. With this font you have 38 beautiful, hand-crafted icons at your disposal for any use.
PulsarJS @FontFace 73 Free IconFont
An IconFont with some of the most used icons used in mobile development.
Raphaël Icon-Set
This is the great Raphaël Icon-Set by Dmitry Baranovskiy converted to a Webfont. Though normaly used as SVGs with the Javascript-Library Raphaël you can now include them with pure CSS and without the need to have javascript enabled.
Symbol Signs Collection
This is a collection of 50 common used signage symbols, professional designed. The symbols signs are free of charge available as an OpenType font format, allowing you to easily add symbols & icons to your sign and wayfinding design.
Socialico
Socialico is a package of 74 social media icons, combined within a single wieght font and designed by Jelio Dimitrov.
Ico Moon (app)
Browse and select icons to download them or make a font. You may import SVG images or fonts too.
Post Tags
12 Comments
Great post, Oliver! For anyone interested, I created a simple WordPress plugin for integrating the FontAwesome icon font into any theme https://github.com/rachelbaker/Font-Awesome-WordPress-Plugin
WOO HOO! Thanks Rachel- just downloaded your plugin and am going to give it a go!.
Thanks for this great list Oliver! I just got itno Font icons and am loving it.
You do a great job for the WP community- will definitely be adding you to my resources page. ;-)
Very useful, and not just for blogs. I’ve already thought of other great uses. Thanks.
Leave a Reply