Taking A Second Look At Free Fonts

Advertisement

Once thought of as amateurish by professional designers, free and open-source fonts have gone through something of a renaissance in just the last few years. The quality of available free fonts has increased dramatically. To be frank, free fonts don’t have a good reputation, and often they are knock-offs of thoroughly crafted, already established typefaces. So is it time for professional designers to take a second look?

First, A Story

Early in my design career, around 2003, I wanted to purchase the font DIN1 for a project at work. My manager promptly dismissed the idea of paying for a font and instead handed me a CD that had “5,000 free fonts” on it, saying “This CD has every font a designer could possibly need. No need to waste money buying fonts!”

I popped the CD in my computer and found a collection of the most horrendous fonts you could imagine. Novelty and “retro” fonts. Spooky Halloween fonts. “Techno” fonts. Fonts with letterforms made up of cats posing in crazy positions. Fonts with terrible kerning, missing glyphs and wonky rendering. Fonts available only in single weights with no italics.

Nowhere to be found was DIN or, for that matter, any font that a professional designer would actually use. Feeling dejected, I ended up just using Helvetica because we actually owned that one.

Fast-forward to 2014. When I hear the words “free fonts,” I still can’t help but picture that horrible CD. But things have completely changed since then, and I find myself actually using free fonts quite often in my projects.

Where Do Free Fonts Come From?

In the past, free fonts typically came from one of two places: amateur designers who created fonts for fun or as a learning experience, and professional type designers who released a single variant of a font family for free as a form of marketing, the idea being that people would come back to purchase the full family once they realized the limited usefulness of a font without multiple weights and italics.

Why Is Having Multiple Weights With Italics So Important?

To set body copy properly, a font family requires four variants: normal, italic, bold and bold italic. A font used on the Web that doesn’t include these four basic variants will inevitably get the dreaded faux bold and faux italic2 treatment generated by the browser, which should be avoided at all costs — in fact, there are3 ways4 to avoid them for good. Other weights, such as light and extra bold, are helpful for creating typographic contrast between elements.

Free Fonts Are Not What They Used To Be

Recently, large companies such as Adobe and Google have been commissioning fonts for open-source projects and releasing them for free on the Web. Professional typeface designers have been getting involved in open source as well, sharing complete font families on Google Fonts5.

Thanks to the open-source community, there are now free fonts available that even typography snobs would be happy to use. The following fonts all have multiple weights with matching italics. They are suitable for headlines as well as body copy, and they render well on screen and at small sizes.

Alegreya

Alegreya6 is an award-winning serif typeface, chosen by ATypI as one of 53 “Fonts of the Decade” in its Letter.2 competition7. It is available for free on Google Fonts, but, sadly, most designers don’t seem to know about it. I hardly see Alegreya used anywhere online, which is a shame because this is a truly great font. Alegreya was designed with printed text in mind, but it is excellent to read on screen as well.

The designer, Juan Pablo del Peral, claims that just as much care and attention to detail was spent on designing the italic as the roman and it definitely shows — the italic style is especially beautiful. I hope more designers become aware of this excellent typeface and that we’ll see it used more widely on the Web in 2014.

Alegreya font sample8
Beef9 uses Alegreya for the body copy on their website, giving it a stately appearance, which contrasts nicely with the use of Avenir10 for headings.

Alegreya font sample11
The beautiful bold italic style of Alegreya is used for a heading on Beef’s job section12.

Source Sans Pro

Released by Adobe in August 2012, Source Sans Pro14 is Adobe’s first open-source font. Its designer, Paul D. Hunt, was inspired by early-20th-century gothics such as Franklin Gothic and News Gothic. To my eyes, Source Sans Pro feels much more modern, a little reminiscent of FF Meta. Its intended use is for user interfaces so it renders very well at small sizes. The font is available in an impressive 6 weights, making it extremely versatile.

Source Sans Pro font sample15
CAST8316 uses Source Sans Pro throughout its website, showing off the diversity of the family; large headlines are set in the lighter weights, while the heavier weights are used at smaller sizes and set in uppercase, creating excellent typographic contrast.

Source Sans Pro font sample17
Plentific18 uses the extra-light and normal weights of Source Sans Pro to create contrast between different levels of headings.

Open Sans

Designed by well-known type designer Steve Matteson and commissioned by Google, Open Sans20 is one of the most widely used open-source fonts on the Web. It is the default font for Zurb’s new Foundation 521 framework and is used on many of Google’s redesigned pages22. I’ve even heard Open Sans described as the “flat design” font. The five weights with matching italics make this humanist sans-serif useful for a wide variety of situations

Open Sans font sample23
Vitor Andrade’s website24 uses Open Sans in a very understated way; the minimal, type-driven design doesn’t draw attention to itself, appearing very neutral and lending focus to the excellent work being featured on the website.

Open Sans font sample25
The light weight of Open Sans is used for the article titles on The Industry’s website26.

Anonymous Pro

Anonymous Pro28 is a monospaced font that I’m surprised so few designers know about, considering it was designed by Mark Simonson29, the type designer behind Proxima Nova30. Monospaced fonts seem to be popular with designers at the moment, and Anonymous Pro is an excellent option.

Inconsolata31 is a much more widely used monospaced font, also available on Google Fonts, but doesn’t include italics, as Anonymous Pro does. Setting body copy in a monospaced font isn’t always a good idea, but in the right context it can give a design a very clean and refreshingly sparse feel.

Anonymous Pro font sample32
Per Sandström33 uses Anonymous Pro at a large size for the body copy on his website, where it works surprisingly well paired with Futura34 for headings.

Anonymous Pro font sample35
The bold weight of Anonymous Pro is used for the buttons on Per’s website36.

Playfair Display

Playfair Display38 is a high-contrast serif designed by Claus Eggers Sørensen. Reminiscent of Baskerville39, it takes its cues from the typeface designs of the late-18th century. Although designed primarily for titles and headings, the three weights with matching italics make it suitable for short stretches of body copy as well. For longer stretches of body copy, Playfair Display pairs very well with Georgia.

Playfair Display font sample40
Playfair Display features a beautiful italic variant, seen in the headings on Boompa Records’ website41.

Playfair Display font sample42
The bold weight of Playfair Display is used on the headings of Digital Abstracts’ website43.

Roboto

Roboto45 has been accused of being a “Frankenfont46” — a mashup of Helvetica, DIN and Myriad. I understand where the criticisms come from, but I quite like Roboto. Updates and improvements47 have been made to Roboto since that “Frankenfont” article, and I think the font works great on screen at different sizes and device resolutions, which is its purpose.

The font feels familiar, yet still possesses unique character the more you look at it. The Roboto family also includes a very nice slab version48 as well as a condensed version49.

Roboto font sample50
I use Roboto on my Type & Grids9351 side project, and the font renders beautifully on high-density displays at small sizes.

Roboto font sample52
Paone Creative53 uses the light weight of Roboto on their blog section.

Lato

Lato55 is Polish for “summer,” and the name perfectly fits this warm-feeling sans-serif. The designer, Łukasz Dziedzic, originally designed Lato as a corporate font for a large client. After the client decided to go in a different design direction, Łukasz released the font for public use. Lato feels very modest and unassuming when set at small sizes in body copy, but the italic variant is distinctive and easily recognizable. Lato is used in WordPress’ latest default theme, Twenty Fourteen56, so its popularity on the Web is sure to increase.

Lato font sample57
Frank Chimero makes elegant use of the hairline weight in his article “What Screens Want58,” setting it in uppercase at a large size, which is needed for such a thin, delicate weight.

Lato font sample59
On AIGA’s “100 Years of Design” website60, a customized “dotless i” version of Lato is used.

Merriweather

Designed by Eben Sorkin62, Merriweather63 is a serif font created for on-screen reading. Its tall x-height and hefty serifs give it excellent legibility. Merriweather is under active development, and improvements are constantly being made. There is also a sans-serif version64 of Merriweather available that makes an excellent companion.

Merriweather font sample65
Dickson Fong66 uses the light weight of Merriweather, which gives his design an elegant look.

Merriweather font sample67
Vtcreative68 show off the light italic style of Merriweather in their footer.

Karla

Karla70 is a grotesque sans-serif designed by Jonathan Pinhorn that is full of character and quirks. Something about it reminds me of the trendy Apercu71 font. The tracking might be set a little wide for body copy, and some of the kerning can be a little wonky, but something about this font makes me overlook those downsides. This is a perfect font to add a touch of personality to your design.

Karla font sample72
Borsch, Vodka & Tears73 use Karla for the short bursts of body copy on its website, and it works really well.

Karla font sample 274
Kalyn Nakano75 shows off the normal and bold weights of Karla on her portfolio site.

Clear Sans

Clear Sans77 is Intel’s recent contribution to the open-source font community. Designed with on-screen legibility in mind, Clear Sans prides itself on its unambiguous character design. For example, the uppercase “I” has serifs added to distinguish itself from the lowercase “l”. This makes it an excellent choice for UI design work where clarity is key. Clear Sans is currently not available through Google Fonts, so designers looking to use this font will need to host it themselves.

Clear Sans Font Sample78
The delicate, light weight of Clear Sans is used for the body copy on the Clear Sans website79.

Fira Sans

Designed for the Firefox Operating System, Fira Sans80 was recently released as a free font available for public use. The font shares many similarities to FF Meta, which makes sense as Erik Spiekermann is the designer of both. It’s rare to find a free font created by such a renowned typeface designer. Fira Sans also includes a monospaced version called Fira Mono. Interestingly, the web font used on the official Fira Sans page is Open Sans, not Fira Sans. You’d think Mozilla would want to show off their new font on their site.

Fira Sans Screenshot81

Other Free Fonts Worth Checking Out

Don’t Rely On Free Fonts For Every Project

As nice as the fonts above are, designers shouldn’t rely entirely on free fonts. Free fonts will never match the quality of the fonts offered by top type design foundries. Budget for professional fonts in every project when possible. Type foundries need the support of the design community to continue innovating and producing excellent fonts.

That being said, if a project requires free fonts, whether due to budget constraints or other reasons, then rest easy knowing that an ever-growing selection of professional-quality fonts are available at your disposal. I continually update a curated list of open-source Web fonts90 in my side project, Typewolf91. You can also follow me @typewolf92 and check out my other side project, Type & Grids9351, which uses many of the fonts featured in this article.

Designing a typeface requires a lot of time, patience and very hard work, and type designers should be rewarded for their work. So if you decide to use a free font, please always make sure to support type designers by purchasing the other fonts that they created or donating to support their efforts.

(al, vf, il)

Front page image credits: Vitor Andrade94.

Footnotes

  1. 1 http://www.typewolf.com/site-of-the-day/fonts/din
  2. 2 http://alistapart.com/article/say-no-to-faux-bold
  3. 3 http://www.smashingmagazine.com/2012/07/11/avoiding-faux-weights-styles-google-web-fonts/
  4. 4 http://www.smashingmagazine.com/2013/02/14/setting-weights-and-styles-at-font-face-declaration/
  5. 5 http://www.google.com/fonts
  6. 6 http://www.google.com/fonts/specimen/Alegreya
  7. 7 http://letter2.org
  8. 8 http://www.wearebeef.co.uk/
  9. 9 http://www.wearebeef.co.uk
  10. 10 http://www.typewolf.com/site-of-the-day/fonts/avenir
  11. 11 http://www.wearebeef.co.uk/job/
  12. 12 http://www.wearebeef.co.uk/job/
  13. 13 http://www.typewolf.com/site-of-the-day/fonts/alegreya
  14. 14 http://www.google.com/fonts/specimen/Source+Sans+Pro
  15. 15 http://www.cast83.com/
  16. 16 http://www.cast83.com
  17. 17 http://plentific.com
  18. 18 http://plentific.com
  19. 19 http://www.typewolf.com/site-of-the-day/fonts/source-sans-pro
  20. 20 http://www.google.com/fonts/specimen/Open+Sans
  21. 21 http://foundation.zurb.com
  22. 22 http://www.google.com/analytics/
  23. 23 http://vitorandrade.co/
  24. 24 http://vitorandrade.co
  25. 25 http://theindustry.cc
  26. 26 http://theindustry.cc
  27. 27 http://www.typewolf.com/site-of-the-day/fonts/open-sans
  28. 28 http://www.google.com/fonts/specimen/Anonymous+Pro
  29. 29 http://www.marksimonson.com
  30. 30 http://www.typewolf.com/site-of-the-day/fonts/proxima-nova
  31. 31 http://www.typewolf.com/site-of-the-day/fonts/inconsolata
  32. 32 http://www.helloper.com/
  33. 33 http://www.helloper.com
  34. 34 http://www.typewolf.com/site-of-the-day/fonts/futura
  35. 35 http://www.helloper.com
  36. 36 http://www.helloper.com
  37. 37 http://www.typewolf.com/site-of-the-day/fonts/anonymous-pro
  38. 38 http://www.google.com/fonts/specimen/Playfair+Display
  39. 39 http://www.typewolf.com/site-of-the-day/fonts/baskerville
  40. 40 http://www.boompa.ca/
  41. 41 http://www.boompa.ca
  42. 42 http://digitalabstracts.com/playing-arts-project/
  43. 43 http://digitalabstracts.com/playing-arts-project/
  44. 44 http://www.typewolf.com/site-of-the-day/fonts/playfair-display
  45. 45 http://www.google.com/fonts/specimen/Roboto
  46. 46 http://typographica.org/on-typography/roboto-typeface-is-a-four-headed-frankenstein/
  47. 47 http://www.androidpolice.com/2013/06/29/typeface-teardown-roboto-gets-a-facelift-in-android-4-3/
  48. 48 http://www.google.com/fonts/specimen/Roboto+Slab
  49. 49 http://www.google.com/fonts/specimen/Roboto+Condensed
  50. 50 http://www.typeandgrids.com/
  51. 51 http://www.typeandgrids.com
  52. 52 http://paonecreative.com/category/culture-blog/
  53. 53 http://paonecreative.com/category/culture-blog/
  54. 54 http://www.typewolf.com/site-of-the-day/fonts/roboto
  55. 55 http://www.google.com/fonts/specimen/Lato
  56. 56 http://theme.wordpress.com/themes/twentyfourteen/
  57. 57 http://frankchimero.com/what-screens-want/
  58. 58 http://frankchimero.com/what-screens-want/
  59. 59 http://celebratedesign.org
  60. 60 http://celebratedesign.org
  61. 61 http://www.typewolf.com/site-of-the-day/fonts/lato
  62. 62 http://sorkintype.com
  63. 63 http://www.google.com/fonts/specimen/Merriweather
  64. 64 http://www.google.com/fonts/specimen/Merriweather+Sans
  65. 65 http://dicksonfong.com/
  66. 66 http://dicksonfong.com
  67. 67 http://www.vtcreative.fr
  68. 68 http://www.vtcreative.fr
  69. 69 http://www.typewolf.com/site-of-the-day/fonts/merriweather
  70. 70 http://www.google.com/fonts/specimen/Karla
  71. 71 http://www.typewolf.com/site-of-the-day/fonts/apercu
  72. 72 http://borschvodkaandtears.com/
  73. 73 http://borschvodkaandtears.com
  74. 74 http://kalynnakano.com
  75. 75 http://kalynnakano.com
  76. 76 http://www.typewolf.com/site-of-the-day/fonts/karla
  77. 77 https://01.org/clear-sans
  78. 78 https://01.org/clear-sans
  79. 79 https://01.org/clear-sans
  80. 80 http://www.mozilla.org/en-US/styleguide/products/firefox-os/typeface/
  81. 81 http://www.mozilla.org/en-US/styleguide/products/firefox-os/typeface/
  82. 82 https://www.google.com/fonts/specimen/Exo
  83. 83 https://www.google.com/fonts/specimen/Signika
  84. 84 https://www.google.com/fonts/specimen/Arimo
  85. 85 https://www.google.com/fonts/specimen/Raleway
  86. 86 https://www.google.com/fonts/specimen/Montserrat
  87. 87 https://www.google.com/fonts/specimen/Muli
  88. 88 https://www.google.com/fonts/specimen/Domine
  89. 89 https://www.google.com/fonts/specimen/Lora
  90. 90 http://www.typewolf.com/open-source-web-fonts
  91. 91 http://www.typewolf.com
  92. 92 http://twitter.com/typewolf
  93. 93 http://www.typeandgrids.com
  94. 94 http://vitorandrade.co/

↑ Back to topShare on Twitter

Jeremiah Shoaf is a freelance designer from Colorado. He is the curator of Typewolf and creates flat-file CMS themes for his other side project, Type & Grids. He also continually updates a curated list of open-source free fonts.

Advertising
  1. 1

    I’m using Signika for a client’s website in development now, and loving it more and more as I work with it. It’s really legible without having that sanitized look techies love so much. The bold really punches in chunks of body text at 16px.

    0
  2. 2
    • 3

      Vitaly Friedman (editor-in-chief of Smashing Magazine)

      March 12, 2014 5:42 pm

      Thanks Thomas — you are absolutely right! Jeremiah is adding a bit about Fira Sans and Fira Mono right away!

      0
    • 4

      Can’t believe I forgot Fira Sans! Great font. The article has now been updated. I’m hoping that Fira Sans will be available on Google Fonts sometime soon…

      0
  3. 5

    How about some free fonts I can actually drop into my Fonts folder and use in InDesign/QuarkXPress?

    -1
    • 6

      Robert Dundon "Mr. Bob"

      March 12, 2014 6:07 pm

      Hi Red,

      Actually you can download the fonts from Google Fonts (When you’re at the JavaScript/CSS paste code screen, look for the download button in the top right) as a ZIP file of TTFs.

      1
    • 7

      Hi Red,

      Google Fonts actually allows you to download the font files to your computer, so you should be able to install them locally and use them in any desktop app.

      1
  4. 9

    Meh, when it comes to design – you do you. Personally most of these choices are okay but quite boring.

    -3
    • 10

      Actually, when it comes to design, it comes down to your client, what they want, and so much more. It has to do with your specific project as well. It really should have nothing to do with “you”.

      I could also write a book about typography itself is, and how free fonts are what they are, and why expensive fonts take into consideration sizing, spacing, kerning, leading, etc. etc.

      Saying “meh” tells me you’re not a designer, not professional.

      1
  5. 11

    Personally, I don’t see anything wrong with free fonts at all. I’m a big fan of using Adobe Web Fonts since I use Edge Code as my main editor, and they’re really easy to implement. A quick note about faux, though:

    I don’t like to overdo fonts, though, so I wouldn’t include multiple versions of the same font. When faux is making things difficult, you can implement font-smoothing techniques and whatnot to make the legibility better:

    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.004);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;

    In the case of larger websites, when load speeds are all the more important, font-smoothing makes Arial look much more nicer. Legibility is much better, especially when using a smaller font size.

    2
    • 12

      It depends on your project and what you are doing.

      Display fonts need every single letter kerned, and smaller ones (web, magazine, book) need the help of programs like InDesign to really be able to work out legibility and readability.

      Free/cheaper fonts generally don’t have a lot of work put into them. You have issues with consistency in style with all letters, botchy curves, missing letters, not completely crisp throughout, and other issues.

      You will also encounter issues with commercial use when doing commercial projects with free fonts.

      0
  6. 13

    Great article. I really like how you take time to explain each font’s mood, history and best use.

    The game has really changed. So many quality fonts.

    2
  7. 14

    I end up using free fonts a lot because they’re easy to experiment with and test drive. I don’t mind paying for fonts if I know I want them, but I always feel like I could be wasting my money if I end up not liking it when used in the actual setting rather than just the “preview” on most font sites. I have seen some that let you download and use it for 15 minutes which is definitely an improvement.

    Anyway, this is a great list of free fonts that are mostly new to me. Will definitely be making use of them.

    1
  8. 15

    There are so many good free fonts. Titillium is the one I would certainly add to this list: https://www.google.com/fonts/specimen/Titillium+Web

    2
  9. 16

    Nice article! Bookmarking this one.

    0
  10. 17

    I recently made a website for previewing Google web fonts on any website. Just choose the elements wich text contents you want to display in with specific font and it will be replaced instantly. Unfortunately the preview just works with the standard font weight at this time. I hope it is useful for some of you: http://webtypetest.com.

    1
    • 18

      Nicely done. Too bad the fonts aren’t ordered alphabetically though.

      It could use some work but it’s definitely a great start, thanks!

      0
  11. 19

    Great article, Jeremy. :)

    Ubuntu is also great by the way. :)
    It’s so unique.

    1
  12. 20

    Hey guys, I really do love you, and I read smashing all the time, but honestly there is not a single woman on this list. Are there really no women doing any typography we love? Anyways, these are all great pieces of work and I use most of them on a regular basis so I’m just as much at fault. Just thought we could shine a flash light on that.

    -4
    • 21

      Hi Eric,

      Signika was designed by Anna Giedryś and Montserrat was designed by Julieta Ulanovsky. Both are excellent typefaces. The only reason they weren’t featured more prominently in the article is because they don’t contain italic versions.

      1
  13. 22

    Thank you for this article Jeremiah. I’ve used a few fonts from http://losttype.com — you can donate any amount to the type designers for each font downloaded.

    It’s great to find free resources but really important to remember to support the design community by purchasing fonts and other design resources whenever possible — a healthy design ecosystem benefits everyone.

    1
  14. 23

    I actually recently decided on using Source Sans for our company brand and particular our application suite. Budgetary issues aside, the open source nature is a nice sentiment which works with our company culture but visually it strikes a balance between clean neutrality and a little bit of fun. I was impressed by it versatility (not just the amazing weight options) but the fact that we are using it for both print and on-screen work.

    Agree that “free-fonts” isn’t the dirty phrase it used to be… but it still has it’s risks of course like all “open-source” stuff…

    0
  15. 24

    Omphalosskeptic

    March 13, 2014 1:13 am

    What about the beautiful Linux Libertine Family? Italics, Small-Caps, Open type features — the whole nine yards. It’s not on Google Fonts, but it’s free & open source.

    2
  16. 26

    With a great combination of free fonts, weight, and style, you could come up with so many beautiful typography. That’s said, I might be biased because I’m a big fan of Open Sans and Roboto! I used these on almost all of my projects.

    Great article by the way. Discovered so many fonts I didn’t know were free from this article. :)

    1
  17. 27

    This is a pretty good overview of the high quality free stuff that it is available now. It’s true that there many more high quality free fonts (not bundled with system or software) today. You focus on the Google Fonts commissioning program in your intro, but it’s important to note that most of the multi-weight families of merit were not commissioned by that program, but were funded by other sources (Adobe for Source Sans, Google the corporation for Open Sans and Roboto, Intel for Clear Sans) or were built upon pre-existing designs (FF Meta for Fira Sans).

    My point: building a professional type family still requires hundreds of hours of specialized labor and that labor usually requires significant monetary compensation at some point, if not from the user than from some other entity. I have no problem with open source fonts as a general concept, as long as the type designer is fairly compensated. But right now, most of that compensation comes through corporate commissions, so the commercial font market is still where most of the best publicly available type will be found.

    0
    • 28

      Thanks for the comment, Stephen. It’s great to have the input of such a well known member of the type community. I agree with you 100% about the importance of supporting type designers. Hopefully the last few paragraphs of the article addressed that point well enough. And yes, large companies like Adobe, Google and Intel have been behind some of the larger, more complete open-source fonts available.

      0
  18. 29

    Hi Guys,

    great roundup Jeremiah! In case you are interested: A while ago we build a small showcasing site for Google Webfonts… http://typewelike.de/

    Best,
    Stephan

    0
  19. 30

    Helena Sandberg

    March 13, 2014 9:33 am

    Dear Jeremiah,
    thank you for great input! I can see the light, the world is getting better and better!
    Best,
    Helena Sandberg

    0
  20. 31

    Don’t forget Lato has a slab serif companion available in 6 styles: Aleo.
    You can download it here ( http://www.behance.net/gallery/ALEO-Free-Font-Family/8018673 ) and see it in action here ( http://www.paocriacao.com.br/site/ ).

    0
  21. 32

    If you’re looking for something different there are some nice fonts here:

    http://www.losttype.com/

    I have used some of these successfully for projects whilst paying a fair price for them which is where their model differs.

    I agree that budgeting for professional fonts is great but it can sometimes be a difficult sell to clients who have only ever used fonts that are bundled for free on their computers, educating clients can sometimes be difficult on this topic, especially considering how much a professional font can cost.

    I would like to see the foundries change their cost models, to make their prices more affordable which would open the fonts up to more wide scale adoption and probably make them more money in the long term.

    0
  22. 33

    I am personally a big Fan of Open Sans, Source Sans Pro and I am especially fond of Lato because of its versatility. Unfortunately Lato is unreadable at 300 below 17px font size on Windows (chrome). Increasing it to 400 would make the font look bold on mac os, so thats a real problem.
    This problem wouldnt occour, if google would deliver the webfont as svg. <.<

    1
    • 34

      Yeah font rendering on Chrome in Windows is pretty bad in general. Apparently that is something Google is currently working on improving…

      0
  23. 35

    Very pleased – these are the fonts I’ve been using. Now I feel I got confirmation that they were good choices! Wonderful examples.

    0
  24. 36

    I’m really surprised that you did not mention the most important source for high quality free fonts: http://www.fontsquirrel.com

    there you will find almost all the fonts you showed above and many more.

    0
  25. 37

    I keep wondering lately how long it is until “on-screen legibility in mind” is just “designed for legibility” because most design will be for screens first and print second.

    Thanks for the roundup!

    0
    • 38

      Excellent point. I feel like type design has such a long history in the print world that in some cases it feels like type foundries are still trying to adapt to the digital world. H&FJ is one of the largest type foundries and they just recently got into the game with their web fonts service.

      0
  26. 39

    There’s an ingrained perception that commercial products are inherently better than “free” ones. I’ve used maybe half of the typefaces you mentioned Jeremiah precisely because they fit the project requirements and are of higher quality than commercial fonts available within the client’s budget.

    Fontsquirrel.com is another great location for open source fonts (of various quality), definitely worth a look.

    Also some super bargains can be found in myfonts.com special offers – and it does feel good to support the type designer in a small way.

    0
  27. 40

    Brittany Taylor

    March 13, 2014 7:06 pm

    Great Article! I will definitely be bookmarking this for future freelance projects. I’ve used some of these fonts before, but am very excited to use some of these that are new to me in the near future.

    0
  28. 41

    ” Free fonts will never match the quality of the fonts offered by top type design foundries”

    Never is a dangerous word; it can come back to bite you.

    Only a few years ago, people were insisting that the idea of free-licensed fonts would never catch on. Now, there are dozens available — still fewer than those available for sale, but a respectable showing, all the same.

    Now, with fonts being developed as open source projects, their creators sometimes have access to the same resources as leading foundries.

    True, many free-licensed fonts are poor quality, but, then, so are many that are sold. There is still a handful of free-licensed fonts that have all the quality you could want — Gentium, for example, and some of the offerings of the League of Moveable Type. At the rate free fonts are progressing, the next few years should see many more.

    0
  29. 42

    Stunning post. Love it.

    0
  30. 43

    Christina Paone

    March 14, 2014 5:28 am

    Awesome list of examples – you are providing such great resources all around the web so keep up the great work – we all sure appreciate it. I completely connect with ’500 free fonts on a CD’. It was almost scary taking the leap to using ‘Free’ fonts but so happy I did. I would say I use google fonts/open source fonts for all my client work nowadays. It is also not always related to cost but rather ease of access – any person on their team can get a font when needed without worrying about licences or files.

    1
  31. 44

    every time i’ve seen quicksand used i’ve been impressed
    https://www.google.com/fonts/specimen/Quicksand
    i don’t have any links but I really like it

    0
  32. 45

    Great article! It makes me smile to see such a summary of my “most favorite fonts” at one place.

    0
  33. 46

    Glad to see Merriweather on this list – it’s such a pleasant font to read, and looks great even in Chrome on Windows. I use it for body text on my website/blog, paired with Open Sans for headings.

    Another worth mentioning, although is a more limited context, is Source Code Pro (the monospace sibling of Source Sans) – it renders really nicely at typical ‘code editor’ sizes on Macs (less so on Windows, where I think Consolas still has the edge).

    0
  34. 47

    Thanks for a useful survey. I’m disappointed by the conclusion, though, which seems to make a typical English-language confusion between free = gratis and free = libre: “Free fonts will never match the quality of the fonts offered by top type design foundries.” If I were one of the established designers whose work featured in this article, I’d take exception to the implication that my libre work was somehow inferior to my proprietary work.

    Stephen Coles gets closer, when he comments: “I have no problem with open source fonts as a general concept, as long as the type designer is fairly compensated. But right now, most of that compensation comes through corporate commissions, so the commercial font market is still where most of the best publicly available type will be found.” Unfortunately, the deduction is faulty: there is no inherent reason why corporate commissioned fonts should be proprietary. Corporate clients typically require a period of exclusive use, but they don’t care on what terms the fonts are distributed when that period ends.

    High-quality free fonts have been around for a while: even when the author was staring in horror at the CD of rubbish he’d been handed by his boss (I remember having a similarly disappointing experience some years earlier, so I sympathise), URW’s clones of the standard Postscript fonts for Ghostscript already existed (created in 1996), as did Bitstream Vera (2002).

    Let’s also not forget the anomaly of digital fonts falling under copyright law, as typefaces in general do not: free fonts are urgently needed to bring good designs into the public domain which otherwise will be unusable by those unable or unwilling to pay for commercial licenses until Mickey Mouse’s ears stop growing.

    Finally, the issue of free fonts is not merely one of cost: for many languages, it’s a survival issue. In this famous blog post, an Adobe employee decides which Cyrillic-using languages get to have digital type: http://blogs.adobe.com/typblography/2006/08/defining_an_ext.html For the rest, tough luck. For such languages, free fonts represent one of their best chances of being usable on the internet (indeed, even for such old-fashioned purposes as word-processing), and may well therefore represent a major plank in their survival platform as the rising waters of technical climate change start lapping at their isolated archipelagoes.

    We should all be fighting for free fonts as a key part of a free culture!

    (Declaration of interest: I’m a free software developer; recently I’ve been working on the libre font design program, Fontforge.)

    1
    • 48

      Thanks for the thoughtful comment, Reuben. The main point of me saying “Free fonts will never match the quality of the fonts offered by top type design foundries” was to stress the importance of supporting type designers. I know it’s not as simple as that and the open-source/free-software movement is really changing things. I think this is an interesting topic and maybe it even warrants an entire new article…

      0
  35. 49

    J.B. Nicholson-Owens

    March 14, 2014 3:27 pm

    “Free fonts will never match the quality of the fonts offered by top type design foundries.” is completely unjustified and unexplained. Even by your unstated criteria, some of the fonts you list are designed by known professional font designers. You should remove that sentence or add specific criteria that let readers understand what you mean by that.

    0
    • 50

      Perhaps I shouldn’t have used the word “never” as obviously there are always going to be exceptions. However, as a general statement I believe it holds true.

      Look at the typeface Whitney from H&FJ. It contains romans, italics, roman small caps and italic small caps with each available in 6 different weights. There is also a condensed version as well as fractions, tabular figures and extended symbols. Plus there is a ScreenSmart version, that is completely redesigned for display on screens. Creating such a complete typeface like that is an insane amount of work. It’s extremely rare to come across a free font with even close to that amount of features.

      The main point of that sentence was to stress the importance of supporting type foundries. Yes, there are quality free fonts available. However, what we don’t want is for designers to devalue typeface design.

      0
  36. 51

    adolf witzeling

    March 14, 2014 9:25 pm

    Good post Jeremiah!

    -1
  37. 52

    I found that the majority of the work in making a font is dealing with bad software.
    In fact, the entire method of dealing with type in the digital realm is a Rube Goldbergian nitemare that seems to be based entirely on the motivation to save space.

    Back when an 8 gig hard drive was a big deal and 26 kilobytes per second dialup was what everybody got 50 hours of from AOL for 25$ per month, keeping file sizes to a minimum was essential. But now, with terabyte hard drives and unlimited 50 mbps internet access becoming common, the urge to keep file sizes low is disapearing.

    So I’m thinking that picture fonts, even tho the file size for a document is way bigger, could start to take over because they take much less work (if the software is good) and offer unlimited shape & color dimensions. And, perhaps most importantly, they have uniform, universal compatibility – they work on any platform or application or device that can handle images.

    0
  38. 53

    Great post! Some fonts that I miss on this list, but the ones you have are great. Funny I didn’t see it before, I just posted my own list of free (Google) Fonts here:
    http://www.jonassebastianohlsson.com/blog/2014/03/15/the-best-of-google-fonts-by-category/

    Any reason why your list contains almost no Serif fonts?

    0
  39. 54

    Thanks Jeremiah for this post, and thanks for listing Source Sans Pro. I use it now for an infogram and I love it!

    0
  40. 55

    I might as well use Windows and Mac fonts…

    0
  41. 56
  42. 57

    Great article! Thanks for the list, it’s bookmarked now :)

    0
  43. 58

    Very useful fonts collection!

    -1
  44. 59

    “As nice as the fonts above are, designers shouldn’t rely entirely on free fonts. Free fonts will never match the quality of the fonts offered by top type design foundries.”

    That’s not quite true. Fonts like the Ubuntu font family and the Liberation font family (their latest versions) are free and open-source fonts with perfect hinting and kerning. For example, Liberation Serif matches the exact metric specs of Times New Roman and Liberation Serif is even more beutiful in terms of drawing the glyphs of the characters.

    These two font families, Ubuntu and Liberation, are high quality fonts and they are designed by really professional open-source type developers. On UNIX-based systems (including Mac OS X) these fonts look perfect! They are optimized for using in Linux-based distributions like Debian, Ubuntu, Fedora, openSUSE, etc. Only on Windows they don’t look so shiny, but as a person who has interests in typography, I can tell you that Arial has worse kerning than the fonts I mentioned above.

    0
  45. 60

    Two days after working on my new website i’ve read your article about free fonts. The funny think is that i have the font “Alegreya” in use and its the first font you are writing about. I agree with you if you say “this is a truly great font”. Yes it is.
    Maybe here is one inspiration more for you: http://www.webnut.de

    Thank you for this nice article.

    0
  46. 61

    All great insight and resources Jeremiah! I love that Lato font, as long it’s uncomplicated!

    If you or any other readers are type fanatics, check out the type.is/good font forum. It’s full of font resources and other graphic design collateral that may be useful to any designer.

    The forum is private or subscription only now I believe, but if you can join up, you’ll be in font heaven! If you have to opt for the subscription option, do it! It’s come in quite handy on many projects that I’ve been working on and saved me so much trouble, money and headaches in the long run, unlike a lot of other places.

    0
  47. 62

    I am an architect designing and building residential and commercial projects in Colorado and have “dabbled” in web design for the purpose of marketing myself and my company. This article is VERY useful for me as I am a complete amateur and need quite a bit of guidance when looking for nice, low-cost fonts.

    Thank you for empowering me Jeremiah!

    0
  48. 63

    Alegreya is my “go-to” and favorite font-family. :) http://techgnotic.deviantart.com/journal/Watercolor-429547939

    0
  49. 64

    I share your sentiment about free fonts.

    I do like a lot of the free fonts you have listed here. I would love to use less “free” fonts though in some projects. Google and Adobe (more specifically Typekit) make it so easy to use their fonts on the web via their service.

    Thankfully though purchasing quality fonts doesn’t have to be too expensive these days.

    0

Leave a Comment

Yay! You've decided to leave a comment. That's fantastic! Please keep in mind that comments are moderated and rel="nofollow" is in use. So, please do not use a spammy keyword or a domain as your name, or else it will be deleted. Let's have a personal and meaningful conversation instead. Thanks for dropping by!

↑ Back to top