Design & UX
Article

5 First-class Free Fonts For Your Next Project

By Elio Qoshi

Finding the right font for your project can be a challenge — especially if you are not a dedicated ‘type nerd’. This task becomes even more difficult if you decide to limit your selection to free fonts.

Today we are going to present a selection of free and open fonts with which you'll rarely go wrong. The following fonts are all licensed under either the Apache License, or the SIL Open Font License.

Both licenses ensure that users can freely modify and use these fonts (free as in 'freedom') while not having to pay anything (free as in 'free beer').

Let's have a look.

Open Sans

As the unofficial flagship font of open fonts, Open Sans has gained popularity since it was introduced in 2011 by Google. Designed by Steve Matteson, it shares many characteristics with Droid Sans, except it features wider characters and italic variants.

Visual comparison: OPen Sans versus Droid Sans

As an open font with 897 characters, it has enormous localization potential, and therefore is very popular with various language locales, apart latin. Open Sans offers 5 different weights (300 Light, 400 Normal, Semi-Bold 600, Bold 700 and Extra Bold 800) and each one features an italic version.

Additionally, the separate Open Sans Condensed font is available in 3 width variations. Open Sans is optimized for print, web, and mobile interfaces, and has excellent legibility characteristics in its letterforms.

Open Sans has been widely used in Google's print and web advertisements. An example is the Google Open Source Blog. You can encounter Open Sans also on Google Maps.

Open Sans used on  Google Open Source blog

Further, WordPress.com also switched from from Helvetica/Arial to Open Sans in October 2012, after having it implemented in its WordPress.org Content Management System.

Wordpress.org: Before and after.

Similar to WordPress, in terms of aligning their brand values with their assets, Mozilla also took the leap into Open Sans after latter was released in 2011. You can see Open Sans almost anywhere where Mozilla at present, even unofficial community sites. This open font has gradually replaced Erik Spiekermann's FF Meta, which is a proprietary font. Let's say Open Sans came along at just the right time.

Opens sans on Mozilla.com

League Gothic

League Gothic is a revival of an old classic, based on Alternate Gothic #1, originally designed by Morris Fuller Benton for the America Type Founders Company in 1903. The company went bankrupt in 1993, and since the original typeface was created before 1923, the typeface is now in the public domain.

League Gothic example

League Gothic is licensed under the SIL Open Font license and available in Regular and Condensed, as well their Italic alternations.

This is another example where an open font has been used well while aligning perfectly with the views of the organization using it, is the Open Society Foundation (the name says it all, right?).

League Gothic has been used here for various headers, giving the website an elegant look reminiscent of a refined newspaper — a well designed header area emphasizes this theme.

Open Society using League Gothic

A great ‘one pager’ where League Gothic really works well is Appliance Tec Ltd.

Appliance Tec Ltd. site

Roboto

Roboto is the successor to Droid Sans, the system font for Google's Android operating system (well technically it's not Google's, as Android is open source, but that's another matter).

The font is licensed under the Apache license and the entire font family was officially made available for free download on January 12, 2012, on the newly launched Android Design website. The family includes Thin, Light, Regular, Medium, Bold and Black weights with matching oblique styles. It also features condensed styles in Light, Regular and Bold, also with matching oblique designs.

Together with Open Sans, Roboto makes up the flagship fonts of Google. Check out the Material Design Styleguide:

Roboto in Material Design

It's noticeable that Roboto is very popular for one page websites and especially startups. An example here is the website of StandupMail:

StandUpMail site

As Styx said ‘Domo Arigato, Mr Roboto‘.

Lato

Lato is a sans serif typeface family designed in Summer 2010 by Warsaw-based designer Łukasz Dziedzic (“Lato” means “Summer” in Polish). In December 2010 the Lato family was published under the SIL Open Font License by his foundry tyPoland, with support from Google.

In 2013 – 2014, the family was greatly extended to cover over 3000 glyphs per style. The Lato 2.010 family now supports 100+ Latin-based languages, 50+ Cyrillic-based languages, as well as Greek and IPA phonetics. In the process, the metrics and kerning of the family have been revised and four additional weights were created.

Lato - visual reference

A great example where Lato (Light in this case) has been used, is Frank Chimero's "What Screens Want" page. In this case it contributes greatly to the storytelling the website focuses on.

Another interesting website where Lato is very effectively used is Designer checklist advices.

Designers checklist advices

The landing page of the upcoming secure messenger Hemlis, uses Lato as the primary font also.

Hemlis messager site

Source Sans Pro

As a sans-serif typeface, Source Sans Pro was created by Paul D. Hunt for Adobe. It is the first open source font family from Adobe, distributed under the SIL Open Font License.

Source Sans Pro is available in six weights (Regular, ExtraLight, Light, Semibold, Bold, Black) in upright and italic styles. The typeface has wide language support for Latin script, including Western and Eastern European languages, Vietnamese, pinyin Romanization of Chinese, and Navajo.

The renowned New York-based news portal digg uses Source Sans Pro as their primary font.

Digg employing SOURCE SANS PRO

Further, the developers at Scytale make great use of Source Sans as the sole font for their website.


Scytale site

Found your font yet?

Luckily, the quality and quantity of available free fonts has been raised dramatically in recent years, allowing designers more creative freedom without needing to commit to purchasing commercial fonts.

One of the best resources to find free and open fonts is FontSquirrel.

As with mixing oysters and ice cream, sometimes very good things go very badly together. Type is no exception. If you're unsure how to pair various fonts, have a look at FontPair — it might give you a better overview of the fonts you can use.

What's your favourite Free/Open font?

Comments
MatsSvensson

Fancy extra special fonts seems to be mostly used to make sites worse.

The low-contrast hemlis-example for example, looks like pure garbage.

And the new Wired is like one of those test-pages that shows you all the fonts in your system.

devchrisbrand

The link is broken, it's directing to http://www.sitepoint.com/5-first-class-free-fonts/www.fontsquirrel.com Figured i'd let you know.

omnicity

In the article you say:
"League Gothic is licensed under the SIL Open Font license" but you also say it is public domain, so which is it?

jeffreylees

The original typeface went into public domain. League Gothic is their new version of it, which is SIL Open Font licensed.

omnicity

So if this version is very similar to the original, then it cannot be copyright of anyone else. On the other hand, if it is different enough to count as an original piece of work in its own right then at the very least it needs a new name...

It's bad enough when multi-national companies abuse copyright, without the open source community jumping in too.

jeffreylees

I would definitely encourage you to read about what you're posting about before commenting scathingly.

The original font was not the same name; it already has a new name, mentioned both in the article and on the League Gothic site. Additionally, the OFL is essentially just saying that people can't take their work and sell it alone. It doesn't prohibit reuse, sale of documents using it, people creating new fonts using it, or even people selling products with it included. I hardly think that qualifies as "abuse of the copyright system". It's about as tame of a license as you can get, and completely acceptable for this type of work. Protects your work from open abuse (people selling your font file on their font sales website, for example) while allowing open redistribution, alteration, etc.

omnicity

I did read the entire article when I first commented, sorry if I missed the change of name when I re-read it.
That in no way negates my previous point, which is that even an Open-Source licence depends upon having valid copyright. It matters not a jot whether the licences in question is "tame" as you put it, or a full-on commercial pay-through-the-nose licence, if the basic product is PD to begin with, and therefore un-copyrightable.
The very fact that we are having this discussion shows that there is ambiguity, either in this article or in the advertising of this font.

jeffreylees

I've definitely no interest in turning this article post into a discussion or debate on what can and cannot be done with open source licenses; My understanding is that what they're doing is completely acceptable; the license is applying to their version of this (product) - not to the public domain one. It's essentially a "please don't take our efforts and sell them as your own" - and afaik this is an extremely common and perfectly valid practice. It happens all the time, and there are, as far as I know, no rule stopping you from re-purposing Public Domain content, "adding your own value to it", and selling as a new product. If you want to discuss it further with (probably someone besides, or in addition to, me as I'm not a copyright or license expert) I'd suggest that you start a new topic (Reply as linked topic, below?) to discuss. But it seems like it's a broader topic than just this one organization - they are not unique here.

Recommended

Learn Coding Online
Learn Web Development

Start learning web development and design for free with SitePoint Premium!

Get the latest in Design, once a week, for free.