Typ.io: A Tool for Web Type Inspiration

I am addicted to nice looking type. I lamented back in the old days when web type was restricted to just a handful of universal system fonts. Thankfully, web type has come a long way in the last few years, and services like Typekit and Fonts.com, along with wider use of @font-face are at last delivering a web full of interesting typefaces.

Nowadays, I am constantly happening across sites with great typography, where I think, “Hey, great combination! I should remember that!” Or else I am working on a design and looking for a bit of raw inspiration and go hunting for samples in the wild. Finding inspiration and keeping track of inspiration is a serious task for designers.

There are all sorts of tools that you might consider for this task: Pinterest is great and widely adopted, but it has a couple of fatal flaws — When looking for inspiration, there are plenty of great pins, but almost none of them identify typefaces and very few bother to link back to an actual source site. And if you come across a site in the wild that you want to recall, screen-shotting it for pinning can be a hassle. Alternately, you might try a site like Fonts In Use, which lets you browse inspirational samples by typefaces used, and also provides a bookmarklet for adding new projects. The problem here is that it isn’t super easy to determine which fonts are available for web use, and even within the Web format section, there is no easy way to tell whether a font is provided by whatever web font service you may personally use.

I recently discovered Typ.io, a web app that is perfect for the job. Unlike the above mentioned tools, Typ.io is specifically focused on web fonts. On the site itself, you can browse samples of clipped sites, complete with a list of fonts used and which web font service powers the site. You can also sort by font service library, which is great if you already have a subscription to a particular service and want to see only samples with fonts you can actually use. You also have the ability to like other users’ samples for future reference.

Another really sweet feature is the Chrome extension, which makes it really easy to discover the fonts in use on any site, and rolls in a Pinterest-like ability to clip websites, complete with font information and a screenshot. (The screen-shot feature could be better.) If you don’t want to use the extension or don’t use Chrome as your primary browser (Bwwwaaaa???), there is also a bookmarklet available.

One thing Typ.io doesn’t have yet that I would like to see in the future is a more direct social componant, where you can friend or follow other users. This feature would make it more of a direct analog to Pinterest for web type. Until then, just keep your eyes open for samples shared by codecarpenter.

Leave a Reply