The increasing popularity of CSS @font-face embedding for custom fonts on websites opens up tons of possibilities for more creative typographic design on the web, however another slightly less explored @font-face technique at the moment is scalable vector icons (or dingbats) on the web, other than the possible accessibility issues, the advantages of replacing icon images with icon fonts are impressive, most notably the ability to style icons dynamically with CSS and their infinite scalability.
We have compiled a list of the 12 best free and premium icon webfonts.
Notice by otlab.ru
Ikoo by Dasmuse
Symbol Signs by Sander Baumann
Guifx v2 Transports by Guifx
Glyphx by Nick’s Fonts
Dot Com by Kreative Korporation
The next 6 fonts do have a price on them but, in terms of the quality and practicality of these icons though, it should be a relatively small cost. Some premium options even include with the CSS @font-face stuff already set up for you to use, so you’re ready to go straight away.
Pictos by Drew Wilson
ClickBits by Fonthead Design Inc.
InfoBits by Fonthead Design Inc.
Writesocial by kndmedia
Wingdings2 by Microsoft
Wingdings3 by Microsoft
These are a collection of what we think are the 12 most practical icon fonts for user interface and web design, there are considerations to take into mind when using font replacement techniques in designs though, for example some more detailed icons are still most suited to bitmap images, icon fonts are really only for simple vector shapes at the moment and probably will be this way for quite a while.
Do you know any of any free or premium hidden gems we’ve missed?