The last couple of years has seen the rise of the embedded web font. At last it’s become practical to use more than the handful of standard system fonts within websites. There are many options for embedding web fonts, but surely one of the most ubiquitous sources is Google. They currently have 197 font families available (July 2011) which can be quickly previewed here:

But the quality does vary, and the names won’t be familiar to most traditional graphic designers, so I’ve put together a list of 20 of the most “useful” Google fonts. My criteria was to create a selected fontbook set that I personally would use on a day-to-day basis. So they tend to be the more conservative choices.

  • Amaranth (A quirky bold, sans serif with some unusual shapes)
  • Andika Basic (You’d call it a sans serif but it has the tiniest flicks of serifs)
  • Arvo (A square slab serif, modern feel, an alternative to Rockwell)
  • Brawler (A medium bold tapered serif, good a various sizes)
  • Cabin (A bold sans serif, Frutiger-ish)
  • Copse (A bold, slab serif with rounded edges and a few loops here and there, slightly typewriter feel)
  • Droid Sans (A bold sans serif, Frutiger-ish)
  • Droid Serif (A clean solid serif)
  • Ezra SIL (A solid serif, slab-ish)
  • IM FELL (Eroded old-style serif)
  • Kameron (Modern, clean slab serif, rounder than Arvo/Rockwell)
  • Kreon (A bold, quirky slab serif)
  • Lato (A straight sans serif)
  • Metrophobic (A rounded, modern sans serif, all lines consistent weight)
  • Michroma (A wide, bold modern sans serif, all lines consistent weight)
  • Molengo (A straight sans serif)
  • Philosopher (A quirky “mixed serif”)
  • Play (A bold, modern display sans serif, all lines consistent weight)
  • Quattrocentro Sans (A straight sans serif)
  • Tinos (A bold, slab serif with rounded edges)

I haven’t necessarily used all of these a LOT yet, so this list may change over time.
By the way – uses Coda (Headings and Navigation) and Brawler (Body text).

Leave a Reply

Your email address will not be published. Required fields are marked *