If you’ve discovered the magic that is the CSS @font-face property, then you have likely run into one of its biggest problems: while there are plenty of free fonts online, not many are licensed with terms that allow you to use them with @font-face. A you’re technically “redistributing” the font when you upload it to your web server and reference it in a CSS file, which causes browsers to download it, you run afoul of the fonts’ licenses more often than not.
Fortunately, there are typographers designing fresh new fonts and licensing them with @font-face in mind. Where do you find such fonts? There are a couple of sites that I recommend.
The League of Moveable Type
The League of Moveable Type is dedicated to providing “the most well-made, free & open-source, @font-face ready fonts.” It’s one of my favorite sources for fonts these days, and their collection, though on the small side currently, has only excellent examples.
Font Squirrel
Font Squirrel is a font aggregator, along the lines of DaFont.com, that only lists free fonts available for commercial use, and many that are @font-face ready. They also have a handy generator to convert a TTF or OTF font into the various formats required for the bulletproof @font-face syntax. And they have pre-made “@font-face kits,” too. You can toggle a checkbox near the search bar if you only want to include @font-face ready fonts in the results.
