In the past, before options like Google Fonts, web developers were stuck using a limited list of web-safe fonts. Going outside the scope of these “safe” fonts sometimes resulted in pixilation and other issues. However, technological advances in recent years mean computer screens are a higher definition, and even some fonts that used to be on the no-no list for designers are now usable. However, for the best results possible, it’s essential to still choose web-safe fonts that work across multiple types of devices and screen sizes.
There are many advantages to using Google Fonts, including that they’re free and look good across different kinds of platforms thanks to Google’s content delivery network (CDN) and the fact that Google Fonts supports all the major internet browsers and mobile device types. The number of people using a mobile screen to access the internet has grown to 60 percent in the last decade, with around 82 percent of people using mobile devices at least some of the time. Google Fonts ensure your website is accessible to everyone, so we looked at the top Google Fonts based on views and came up with 15 Google Fonts you should be using.
Roboto is a sans-serif font created by Google designer Christian Robertson. He also created Ubuntu-Title and Dear Sarah — a handwritten font. Roboto is meant for Android devices but works well on any device. Roboto has a distinct geometric look but also features curving, open lines that give it an informal feel. It also allows letters to be as wide as needed on the X-axis. This font is a modern looking one, so it’s perfect for fresh, rising technology companies or products aimed at younger generations. The font offers a different set of weights, depending on your needs.
2. Open Sans
Open Sans is another sans-serif font and falls into the humanist category, which Steve Matteson created. Matteson also created corporate typefaces for Android, Microsoft and Xbox. Open Sans is used by Google on a number of their pages. The font has an 897-character set with Latin and Greek character sets. It has an open, friendly look but is extremely legible in different font sizes.
Lato is from the sans-serif family of typefaces and was created by Lukasz Dziedzic in 2010 in Warsaw, Poland. The font was part of a project for a large client but was eventually released to the public. The typeface was created to appear transparent but show unique traits when used in headlines. It’s sleek, elegant and ideally suited for more serious and formal tasks. These letters are curvy, but they still have the straight lines of a traditional sans-serif. Lukasz worked at balancing classical elements, which you can see in the uppercase lettering. Note how the letter “L” has a wide base and the letter “A” is very angular.
Although limited in number of styles (only two), Charm is an excellent handwritten font choice from Google Fonts. Created by the Thai communication design firm Cadson Demak, the font is handwritten and features letters in Thai and Latin. Cadson Demak originally created the letters on paper with a flat tip pen and later adapted the look for online use. The font looks good on religious sites as part of a header or in a logo. The look is traditional, so it would also work well for historical subjects. One issue with some handwritten fonts is that they aren’t easy to read on smaller screens or in smaller text. Charm, on the other hand, is subtle enough that it translates well across all screen sizes.
Oswald is reminiscent of Alternat Gothic sans-serif typefaces. Designer Vernon Adams redrew the traditional typeface to work better with modern screens. He also created Oxygen Mono, Monda and Bowlby One. The original font launched in 2011 but was updated through 2014, as the designer added light, bold weights and additional support for Latin. He also tightened the spacing and kerning over the years. This font has a sharp, crisp look that works well for online magazines and blogs.
Montserrat is an alternate font created by Julieta Ulanovsky. She gained inspiration from old signs in Buenos Aires located in the Montserrat neighborhood, thus the name of the font. The urban typography on the signs was from the early 1900s and has a slightly slanted look almost as though the letters are titled just a bit. The typeface has a tall Y-axis and a fairly wide X-axis. Montserrat works best as a headline, as it creates a wide footprint for body text.
Raleway is a huge font family with 18 different styles, including a sister dotted style for use in headlines or to create worksheets for students. While the font was initially designed by Matt McInerney, multiple other designers have expanded on it to include different weights and styles. This font works particularly well for big headlines because it’s a rather option. In tiny sizes, it’s somewhat faint because of the narrow lines. More than 4,600,000 websites utilize Raleway.
Merriweather was explicitly designed as a serif typeface for screen reading. The X-height is tall, and the letterforms are condensed. The letters are slightly slanted, with heavy serifs and open letters. The U.S.-based type design foundry Sorkin Type led the project creating Merriweather. Note the wide letters and serifs at the edges, creating a crisp look that’s somewhat traditional in nature.
9. Libre Franklin
Morris Fuller Benton was an American typeface designer in the early 20th century. He created a number of vintage fonts. Libre Franklin found inspiration from Benton’s ATF design, but modernized it to look good on screens and all device sizes. The font is a very simple sans-serif without any added embellishments. It works well for invitations and headlines.
10. Crimson Text
Crimson Text offers small caps, figure styles and fleurons. Created by Sebastion Kosch, the font grabs inspiration from designers such as Jan Tschichold, Jonathan Hoefler and Robert Slimbach. It has a heavy weight and partial serifs.
11. Playfair Display
Playfair Display appears in more than 2 million websites. It’s considered a transitional design and was created by Claus Eggers Sorensen as a nod to the European Enlightenment of the 18th century. The font features thin, soft hairlines and heavy curves. The serifs are readily apparent, and the font is best used for larger text such as headlines. Google suggests using Georgia for the body text because it meshes well with the style of Playfair Display. The two fonts were made for displaying together.
Poppins is the invention of the Indian Type Foundry (ITF) and is a multilingual font for both print and digital. Some of the types of companies using this font style include Apple, Sony and Google. Google classifies Poppins as a geometric sans-serif typeface. You’ll notice the style in the designs of the Latin glyphs, such as the ampersand with strong, even strokes that give the font a fluid look. This font has an informal feel that works well for just about any type of website.
13. Indie Flower
Indie Flower handwritten font is the brainchild of Kimberly Geswein. It’s reminiscent of the writing on pottery by well-known artist Rae Dunn, making it a highly popular style right now. The font is young, fresh, carefree and works well for crafting and artist websites. Indie Flower offers a casual look to any heading and also works well for signs and logos.
14. Source Sans Pro
Source Sans Pro was initially Adobe’s open source typeface and one of the first introduced by designer Paul D. Hunt. The font is sans-serif and created for an online environment. Source Sans Pro appears in over 3 million websites and is featured billions of times. The font features straight lines and extra curves on letters such as the lowercase “g.”
Aleo is a serif font created by Alessio Laiso and Keven Conroy as a companion to the Lato font listed above. Details on the letters are sleek and semi-rounded, keeping it bold but readable even on smaller screens. Serifs on verticals are wide and bold, while serifs on horizontals are lighter and thinner. The curves on letters such as “C” and “G” are reminiscent of cursive writing. Although a mere 1,000 websites feature Aleo, the API served Aleo font over 200,000 times in the last week alone. The font works well for user interface in apps, for example.
16. EB Garamond
EB Garamond is an open-source typeface — an updated, elegant version of the classic Garamond font. This timeless font is an old-style serif from the typefaces Claude Garamond designed in the 16th century. The font makes a great option for those working in a professional environment with high-end clients.
As for the design, EB Garamond’s characteristics are made up of thin and thick strokes. The lettering is clear, and you can easily read the text. Though it has an older, classical appearance, it is one of the most used typefaces today. It makes great use of product descriptions, emphasizing an item’s quality.
17. Josefin Sans
Josefin Sans is a geometric typeface with an elegant and vintage feel. It is a sans-serif font type meant for use in larger sizes, such as titles and subheadings. The font was created by Santiago Orozco, and he based his work on the fonts Kabel, Memphis and Futura to create a modern design with Swedish roots. Google caught sight of his font in 2010 and gained permission to use Josefin as part of the Google fonts launch.
Josefin Sans is one of the most popular fonts. Designers love it because of its modern, old-school style. It’s versatile and unique, as the letters sit angularly. Yet, you can use them as you please, from branding and logos to packaging.
18. Bree Serif
Bree Serif is another elegant serif font that became available in 2008. Since then, the font has become a popular choice in design for those looking to pair a font with Bree or as a display text and headline.
Bree Serif has a softer, unique appearance — where the lettering is slightly italic and sits upright. The design’s inspiration comes from the serif fonts of the 19th century. Yet, it includes modern elements to embody a contemporary look. Its large x-height makes it substantially legible, and its boldness effectively attracts attention.
19. Fira Sans
Fira Sans is a sans serif typeface created by Carrois Apostrophe and Erik Spiekermann. It was originally designed for Mozilla FirefoxOS in 2013 but has grown to be suitable for various applications.
Fira Sans’ design has a traditional appearance and looks similar to handwriting. Its distinctive design incorporates a calligraphic feel but is still highly legible due to clean lines. While Fira Sans is minimal-looking, it does have a striking appearance to give it personality. You can see this font has certain characteristics that stand out. For instance, the lowercase “g” has a curved tail and “t” and “l” have a hook on the end.
Due to its versatility, Fira Sans has gained popularity for text use and headings.
Alegreya is a highly distinctive font due to its crowning characteristics. The letters have a rhythmic touch that makes it well-suited for reading large amounts of text. The font makes the reading experience better due to its strong personality. Each letter in Alegreya has soft curves with the lines sharpening at the ends.
Alegreya was one of the 53 fonts chosen as a top contender for “Fonts of the Decade ” at the ATyple Letter2 competition. It became one of the leading text-type systems and was selected for its unique appearance. With such a text-intensive font, reading becomes more pleasurable and would be suitable for use on blogs and in e-books.
21. PT Sans
PT Sans is a versatile and modern typeface, part of the PT Font family and developed as part of the “Public Types of Russian Federation” project. Its design stems from its Russian typography roots, while it also features contemporary design practices.
The font has a friendly appeal but remains clean and modern, giving it a slight calligraphic touch. PT Sans comes in various weights, from bold to regular, making it great for different applications. You can use it in body text or headings — the font provides a professional and approachable feel.
These are just a few of the more popular Google Fonts available for designers. There are more than 915 font families listed on Google Fonts, providing a nice selection of nearly any type of font you might need. Each font has its own personality, so get to know each one on a personal level, and decide which is best for your particular needs.
The Font Series Guide: Introduction
Chapter 1: 15 Google Fonts You Should Be Using
Chapter 2: Times New Roman
Chapter 3: Roboto
Chapter 4: Georgia
Chapter 5: Verdana
Chapter 6: Helvetica
Chapter 7: Comic Sans
Chapter 8: Didot
Chapter 9: Arial
Chapter 10: Tahoma
Chapter 11: Garamond
Chapter 12: Century Gothic
Chapter 13: Brody
Chapter 14: Bromello
Chapter 15: Savoy
Chapter 16: Athene
Chapter 17: Calibri
Chapter 18: Proxima Nova
Chapter 19: Anders
Chapter 20: Monthoers
Chapter 21: Gotham
About The Author
Eleanor Hecks is the Editor-in-Chief of Designerly Magazine, an online publication dedicated to providing in-depth content from the design and marketing industries. When she's not designing or writing code, you can find her re-reading the Harry Potter series, burning calories at a local Zumba class, or hanging out with her dogs, Bear and Lucy.