Apps

Free web font resources for designers

Ryan Boudreaux suggests four great sources for free web fonts.

Everyone likes free stuff right? Sometimes you do get what you pay for, and in the realm of web fonts you can get a lot more than you expect from resources that provide them for no cost. This post will highlight several resources for free web fonts that can be utilized on your websites with simple installation and little groundwork.

Google Web Fonts

Currently showing a library of over 500 font families, Google Web Fonts makes it quick and easy to use for everyone, including professional web designers and developers. Google believes that there should not be any barriers to making great websites, and their goals are to create a directory of core web fonts for the world and to provide an API service so that anyone can bring quality typography to their web pages.

All of the Google Web fonts are open source, which means that you are free to share your favorites with friends and colleagues. You can even improve or customize them and collaborate with the original designer. And you can use them in every way you want, privately or commercially -- in print, on your computer, or in your websites. Figure A displays the Google Web Fonts dashboard.

Figure A

Click to enlarge.
@Font-Face Web Fonts from Fontspring Fontspring offers over 200 font families with free fonts, and many of the families offer a number of styles to choose from within the individual family. Fontspring also offers many for-a-fee fonts as well, with the model of paying only once for desktop or web fonts with no subscriptions and no limits. For example, the Expressway Font family by Typodermic has 28 styles to choose from including the free Expressway Regular font. Fontspring allows viewing of the sample font in various displays including Posters, Specimen, Test Drive, Glyph Map, and @Font-Face Demo. Each font family also has a license; tap to view on the desktop and @Font-Face Webfont licensing. The poster display of the Expressway font is displayed in Figure B.

Figure B

Font Squirrel Font Squirrel provides commercial-use, high quality, free fonts that are hand-selected typefaces presented in an easy-to-use format. The Font Squirrel also provides hundreds of @Font-Face Kits, which allows you to pick from many multiple-font formats, CSS and HTML coding, and allows you to upload your own fonts and generate a custom kit. Each @font-fact kit comes with TrueType Firefox 3.5+, Opera 10+, Safari 3.1+, Chrome 4.0.249.4+, EOT fonts for Internet Explorer 4+, WOFF fonts for Firefox 3.6+, Internet Explorer 9+, Chrome 5+, SVG fonts for iPad and iPhone, Cufón fonts in case you want them, and a Demo.html and stylesheet.css. A portion of the most popular downloaded fonts are displayed in Figure C.

Figure C

Lost Type Coop

While you are encouraged to make a payment for fonts, Lost Type Coop does offer the option of not having to pay, or paying only what you think the font is worth for your particular project. The Lost Type Co-Op is a Pay-What-You-Want Type foundry business model, founded by Riley Cran and Tyler Galpin. Users have the opportunity to pay whatever they like for a font; you can even type in '$0' for a free download. 100% of funds from these sales go directly to the designers of the fonts, respectively. Lost Type takes no cut of sales, and holds no funds.

Figure D

Do you have any go-to resources in your web developer tool kit for free web fonts? Please share them here for your fellow web developers.

About

Ryan has performed in a broad range of technology support roles for electric-generation utilities, including nuclear power plants, and for the telecommunications industry. He has worked in web development for the restaurant industry and the Federal g...

1 comments
stevec
stevec

Other than that, some good resources. Thanks.

Editor's Picks