10 Awesome, Free Typography Tools & Resources

by: Ben Friedle

Typography is an art form and designers spend their lives studying it. For those that don’t have a lifetime to spare or just like typography, we’ve compiled a list of extremely helpful, fun, and interesting typography sites that also happen to be free.

1. Typedia Finally. An encyclopedia completely dedicated to typography. We know you’ve been waiting impatiently for one. On Typedia you can learn about the anatomy of type, explore type faces and type face families, read blog postings from typedia, and join in BadaBoom BBon the forum discussion. The best part, you can look up all things type - this includes typefaces, font foundries, and designers.

2. What the Font Have you ever spent valuable time flipping through all of your fonts trying to figure out what font is used in a client logo? I have, and if you have, then you will understand the value of this tool. What the Font allows you to upload a file and it generates a list of possible font faces that are used. There is also a "What the Font" iPhone app.

3. I Love Typography I Love Typography is my favorite typography blog, but it is actually much more than a blog. The posts are usually inspiring, and if they’re not inspiring, then they are educational. I have spent many uninspired days looking through I Love Typography for inspiration. As well as being a great blog, there are also free wall paper downloads and a store that sells products that only typography lovers would appreciate, like a t-shirt that reads "Helvetica de neue haas grotesk" are sold.

4. Typetester Typetester is a really handy tool that allows you to compare what fonts are going to look like in a web browser. You can compare different font faces, sizes, leading, tracking, alignment, word space, decoration, color, background, color, and number of columns. It’s a handy tool when you are trying to make font decisions in the design phase of websites.

5. Designer Plaything Designer Plaything is another tool that allows you to experiment with different typography and color options on the web. Unlike typetester, on Designer Plaything you can also change the page and article background colors. This site gives you a better idea of what a site containing long paragraphs of type will look like. Esthetically and functionally, I prefer Typetester, but Designer Plaything has its benefits.

6. Vertical Rhythm This is a tool that helps the designer compute CSS that has consistent vertical rhythm. To learn more about what vertical rhythm is, take a look at this article about vertical measure.

7. Color Contrast Check This is another tool that is helpful for designing typography for the web. Color Contrast Check does exactly what its name implies - it allows you to check the color contrast between type and background colors.

8. PHP + CSS Dynamic Text Replacement This is something that I am really excited about, a JavaScript-free version of the Dynamic Test Replacement method. It allows you to take a standard web page and dynamically create images to replace the page headings using PHP and CSS.

9. Fawnt Fawnt is plain and simple, a resource to browse, find, and buy fonts. They have about 10,000 to look through. Better get started.

10. Fontstruct This is a fun site where you can not only buy fonts, but you can also create and sell your own. Use Fontstruct’s free font creator, upload it to their gallery, and try to sell it.

Outlier

Video, Web, and Design Agency