Resources to improve your typography

A living list of online and offline tools I use for typography

Photo by Alexander Andrews on Unsplash

*Updated —10 July, 2020

Scratch my own itch

There is no real story behind this post. Over the years, I have collected a lot of bookmarks across different browsers and apps. While cleaning up I realised there was a Medium post waiting to emerge out of this collection. This one (hopefully the first of many if I have the time and motivation 😝) focuses on resources and tools to create great typography for products.

• Selecting typefaces
• Typefaces
• Type Inspiration
• Courses and Reading
• Typographical Rhythm
• Type Pairing
• Tools
• Type Games
• Font Review Journal

Selecting typefaces

Some reading before selecting typefaces for your next work —

• Type-inspired Interfaces — I often re-read Dan Mall’s 2009 article before picking typefaces.
• Combining Fonts — Hoefler & Co.’s guide offers great lessons about type-pairing (their own). Not only that, but it also helps understanding nuances and characters of typefaces.
• How to Choose a Font — an awesome guide
• FontFinder

Typefaces

Completely Free fonts

• Google Fonts
• Font Library
• http://velvetyne.fr/ — Want fonts with extreme character? Try Velvetyne.
• https://twitter.com/typeparty_ tweets about awesome free and open-source typefaces.
• http://design-research.be/by-womxn/ — Library of libre (free) fonts by Women 🧕👩🏾
• Font Squirrel
• https://www.theleagueofmoveabletype.com/
• Lost Type — a pay-what-you-want foundry (h/t Jimmy Ofisia)
• Atipo Foundry — Free and pay-what-you-want typefaces
• LetterSoup Free
• Open Source Publishing Foundry

Trial and Demo fonts

A lot of typeface stores and foundries offer trial and demo versions of their fonts. Often the free versions offer only a few weights of a typeface or are demo versions with a limited set of glyphs. In either case, they are a great way to try typefaces in your product before buying them.

• FontShop — https://www.fontshop.com/free-fonts
• https://www.fontspring.com/free — FontSpring also allows you to download demo versions of the majority of their fonts like Recta, Sofia, and similar 🔥 typefaces.
• https://www.fonts.com/browse?priceMax=family:pricing:free
• You work for them

Foundries

There are hundreds of type foundries. Including all of them is out of the scope of this article. Instead, the following are a few that let you download demo versions of their typefaces before you buy, which is a great feature for designers.

• *Type.lol — a list of Foundries with flags for trials available
• Dalton Maag
• Klim Type Foundry
• Swiss Type Faces
• Grilli Types Free trials
• Luzi Type
• Displaay Type

Subscription services

• Monotype subscription — Monotype’s subscription allows unlimited use of their fonts. There is also a free version that lets you test-drive fonts for an hour.
• Typekit

Type Inspiration

• Fonts in Use — a gallery of typefaces used in all types of mediums.
• Typewolf — has become the de-facto go-to place for type inspiration.
• Brand New — Brand New is a branding review website. You can learn a lot of typefaces by how they are used in the context
• Magazine Wall — looks like there are no new updates. But Magazine Wall is an awesome place for inspiration for covers or hero areas. ;-)
• Cover Junkie — just like Magazine Wall, this is a collection of magazine covers. Can work amazingly for inspiration.
• Trendlist — visual trends in graphic design.
• Francesco Franchi’s Flickr feed — https://www.flickr.com/photos/ffranchi/with/27131507635/ — has not been updated in a while but is a goldmine of their old work and approach.

Courses and Reading

• The Elements of Typographic Style by Robert Bringhurst
• The New Typography by Jan Tschichold
• Thinking with Type by Ellen Lupton
• Better Web Type
• Designing with Type by InVision
• Type Playbook by Nguyen Le
• Web Typography by Richard Rutter. Richard Rutter started writing about the topic as an adaptation of Robert Bringhurst’s classic The Elements of Typographic Style for the web. From there, it evolved into a book of its own. Also, check Rutter’s typography articles on 24ways.

Typographical Rhythm

Typographical Rhythm is very important in building harmony in your design. Here are a few tools and thoughts on the typographical scale that help you create a smooth hierarchy.

• http://www.modularscale.com/ — Tim Brown’s modular scale is a great starting point for defining your typographical rhythm. Read about typographical scale in this A List Apart article. Tim’s now rarely updated blog Nice Web Type is also a great place to learn more about typography for digital products.
• Owen Gregory wrote an awesome post about Composing the New Canon for 24ways.
• http://type-scale.com/
• Creating Exciting Visual Hierarchy by Carolyn Knight and Jessica Glaser
• Responsive & Fluid Typography by Michael Riethmuller
• Modern Scale for Web Typography by Jason Pamental on Typecast
• Typograph — Scale & Rhythm
• Typeplate — a boilerplate framework
• Bringhurst Double-stranded Fibonacci Series — in the book The Elements of Typographic Style, Robert Bringhurst derives a double-stranded Fibonacci series. The sequence is as following -

Bringhurst’s Double-stranded Fibonacci Series

Type Pairing

• https://fontpair.co — pair Google fonts
• https://fontjoy.com/ — This experiment uses AI to pair Google fonts.
• https://justmytype.co/ — pair fonts from Typekit and Hoefler & Co..
• MixFonts
• Typ.io
• Type Anything
• *Font Pairings by people

Tools

• Fonts Info by Thisarmy — this is a great tool to view all Opentype features of a typeface from Google Fonts. I use this tool a lot to pick fonts with tabular figures, fractions, alternate sets, and what-not! The only problem with this tool is, the catalog of typefaces is not up-to-date with the Google fonts repository. Hopefully, the team at Thirarmy notices this and updates the app.
• OpenType Features Demo

Font Managers

• Skyfonts is a simple cloud-based font manager. You can sync fonts from MyFonts, Fonts, Monotype, and also Google fonts.
• RightFont — Paid. Hardik Pandya vouches for this.
• FontBase
• Monotype App

Type Games

• http://www.typeconnection.com/ — Learn how to pair type by taking them on a date! (h/t Rasagy Sharma)
• Kern Type (h/t Rasagy)
• Shape Type (h/t Rasagy)

If you know of type resources that should be part of this list, feel free to add them in the comments. I will edit the post to include them here with a credit to you. 👍

Don’t forget to like this article by clicking on 👏🏾. Share this with your designer/type-lover friends so more people can create more beautiful typography.

Star design-author/Googler Hardik Pandya has a collection of Resource Toolkit for Product Designers. It not only has additional tools for typography but also for pretty much everything you need to be as awesome designer as he is. 😀🍻

Thanks for reading so far. My name is Tejas and I run a small design studio distributed across India — currently in Ahmedabad, Bangalore, Mumbai. You can follow our in-progress work on Instagram, slightly longer posts on LinkedIn, and quick shares on Twitter.