A Collection Of Free Icon Fonts For Your Websites

Icon fonts are a new thing and they are gaining popularity really fast because of their abilities which make them superior to regular old icons. An icon font file is embedded the same way as a font, meaning that for such an icon you can easily change in CSS the size, the color and even the shadow of each icon shape.

What I find really neat is that if they have transparent knockouts they can work even in IE6, which isn’t possible for alpha transparent PNG icons so this is a big plus. Besides this, you can change their opacity easily and rotate them however you want with no effort, just plain old CSS.

You can also add them gradients, instead of a single color, but that isn’t available in all browsers for now. This gradient feature is not that popular, but it’s worth mentioned considering that some people like their icons in gradients.

A rather skeptic person would comment on their size, that they would be really large and not worth taking into discussion. That would be completely wrong. An icon font loads as much as 14% faster than image icons and is only 10% of a SVG icon font file. This is a useful thing, especially if you have a site with a serious server load.

In this article you will find 20 icon fonts packs that are free to download and 15 other icon packs with flat icons which you can transform into a @font-face pack to use on your websites.

Fontello

Modern pictograms

Foundation Icon Fonts 2

Iconic

Font Awesome

Sosa

GeoBats

Typicons

StateFace

Raphaël Icon-Set

PulsarJS

FF Dingbats 2.0

Entypo

Sanscons

Meteocons

ikoo

ecqlipse 2

JustVector Social Icons Font

Heydings Icons

Rondo

As I mentioned in the previous paragraph, the following list is the one with the icons that are just flat and not ready for @font-face, but you can do that with IcoMoon.