In this article I want to show you the 40 best Google Fonts to improve the design of your website. Google does everything, and has even created its own fonts, the so-called Google Fonts. I’m going to show you what they are, which ones are the best, and how they should be combined. At the end of the post you will also see how you can use the best Google Fonts to improve the design of your website.
What are Google Fonts and why use them?
Google Fonts is a catalogue of over 700 free, open source fonts. This means that you can use any font from Google’s extensive catalogue on your website or blog. They are free fonts, so they won’t be quite as high quality as those covered in this video. However, they can still be very good.
This is a great advance given the versatility it offers us in terms of web page design. Previously only a few fonts could be used in web design, the so-called “safe fonts” (Times New Roman, Arial, Andale mono…). If these fonts were used, there was a risk that the browser would not display them correctly.
Before having this possibility, many designers who wanted to use other fonts put them as an image. This is not the best for positioning and luckily it is not necessary nowadays. It’s also a good reminder to take a look at any of the most popular sites online and seeing what fonts they are using in their content. More often than not, it’s going to be a clean and popular font that many people are familiar with.
With all of this in mind, here are some of our recommended fonts.
Alegreya
One of the most popular, perfect for the body text of any publication or digital content. You can find it in 6 different versions.
Lato
Lato is an elegant typeface and one of the most popular in Google Fonts. Dry wood, with 10 variants and 5 weights, from an ultra-fine (Thin), to the boldest (Black).
Merriweather
Merriweather is a typeface that works very well for body text. It works very well when combined with its companion Merriweather Sans.
Roboto
Created by Christian Robertson, it is a very complete family of sources. It has several versions, mono, condensed and Slab; the latter with serif. The normal version is very similar to Helvetica or Din. Perfect for headlines in their different weights.
Raleway
Typography created by Matt McInerney and with many variants. It is perfect for bodies of text because of its open and rounded curves, as it makes it much easier to read. It has up to 8 different weights and their corresponding variations in italics. They have also created a dotted version that you can see and download from the web.
Montserrat
Montserrat is a font created by Julieta Ulanovsky, who was inspired by the posters and marquees typical of the neighborhood of Montserrat in Buenos Aires and wanted to create this typeface with two different weights, regular and bold. You can also see this font in action here.
Open Sans
Open sans is a dry wood font designed by Steve Patterson and launched in 2011. It has 5 different weights including italics. This makes Open Sans one of the most versatile typefaces there is, as it has many applications. Web design is constantly seen as it has gone hand in hand with the inclusion of Google Fonts in WordPress and the rise of flat design.
Amaranth
Amaranth is a modern-looking typeface with curved and rounded corners. It was designed by Genie Todt, who sought to improve its readability with touches of cursive structure.
Gentium
Very elegant Serif typography and Roman type. It has a lot of personality by itself and combines very well with sans-serif typographies, both for titles and body of text.
How to Pick the Right Fonts for Your Site
When it comes time to finally make a decision and pick the best font for your blog, go with one that is popular and easy to see. The last thing you want to do is make a quick font change to your site and then have everyone leave because they can’t read the content or it’s not easy on the eyes.
When in doubt, go with any of the popular fonts we highlighted above.
