Welcome to Reliable’s Ultimate Collection of Google Font Pairings and Combinations!

We hope you find this to be a powerful resource that helps fuel your personal and client design projects for a long time to come.

We’d be honored if you hit the “share” buttons and help spread the word. Our dream is for this post to help as many designers as we possibly can. Your help in spreading this to more designers is greatly, and warmly, appreciated.

Care to gain insight into how we put this post together and what it’s all about? Read the article that’s placed immediately after the 50 font combinations!

Thanks for stopping by, scroll on down to see the collection, and enjoy!

Share
Sort by
Open Panel
1
robotO condensed bolD
cabin regular

The life of a designer is a life of fight.

Fight against the ugliness. Just like a doctor fights against disease. For us, the visual disease is what we have around, and what we try to do is cure it somehow with design.

Massimo Vignelli

View Roboto + Cabin on Google Fonts

Click to open HTML + CSS

2
raleway light
open sans regular

If I was influenced by anything, it was architecture.

Structure having to do with logic. If you don't do it right, the whole thing is going to cave in. In a certain sense, you can carry that to graphic design.

Paul Rand

View Raleway + Open Sans on Google Fonts

Click to open HTML + CSS

3
playfair display bold italic
source sans regular

Design is the method of putting form and content together.

Design, just as art, has multiple definitions; there is no single definition. Design can be art. Design can be aesthetics. Design is
so simple, that’s why it is so complicated.

Paul Rand

View Playfair + Source Sans on Google Fonts

Click to open HTML + CSS

4
roboto bold
Lora regular

So what is design
all about?

So what is design all about? It [exists to] decrease the amount of vulgarity in the world ... to make the world a better place to be. It doesn’t have to be one style. We’re not talking about style, we’re talking about quality. Style is tangible, quality is intangible. I am talking about giving to everything that surrounds us a level of quality.

Massimo Vignelli

View Roboto + Lora on Google Fonts

Click to open HTML + CSS

5
abril fatface
poppins light

My adventure has all been in my mind.

My adventure has all been in my mind. The great adventure has been thinking. I love to think about things. I think that the lack of drama in my life has produced a platform for me to be fundamentally adventurous in my thinking.

Milton Glaser

View Abril + Poppins on Google Fonts

Click to open HTML + CSS

6
ruda regular
Roboto Slab

I don't think of design as a job.

I think of it as - and I hate to use this term for it - more of a calling. If you're just doing it because it's a nice job and you want to go home and do something else, then don't do it, because nobody needs what you're going to make.

Paula Scher

View Ruda + Roboto Slab on Google Fonts

Click to open HTML + CSS

7
cormorant garamond bold italic
fira sans regular

I want everything
we do to be beautiful.

I don't give a damn whether the client understands that that's worth anything, or that the client thinks it's worth anything, or whether it is worth anything. It's worth it to me. It's the way I want to live my life. I want to make beautiful things, even if nobody cares.

Saul Bass

View Cormorant + Fira Sans on Google Fonts

Click to open HTML + CSS

8
pt sans bold
playfair display regular

It is very important to embrace failure and to do a lot of stuff.

As much stuff as possible — with as little fear as possible. It’s much, much better to wind up with a lot of crap having tried it than to overthink in the beginning and not do it.

Stefan Sagmeister

View PT Sans + Playfair on Google Fonts

Click to open HTML + CSS

9
Roboto light
Cambo regular

I’m a big believer in the emotion of design

and the message that’s sent before somebody begins to read, before they get the rest of the information; what is the emotional response they get to the product, to the story, to the painting - whatever it is.

David Carson

View Roboto + Cambo on Google Fonts

Click to open HTML + CSS

10
oxygen light
Noto serif regular

Kiddies, graphic design, if you wield it effectively, is Power.

Power to transmit ideas that change everything. Power that can destroy an entire race or save a nation from despair.

Chip Kidd

View Oxygen + Noto on Google Fonts

Click to open HTML + CSS

11
arvo regular
lato regular

You have to utilize who you are in your work.

Nobody else can do that: nobody else can pull from your background, from your parents, your upbringing, your whole life experience.

David Carson

View Arvo + Lato on Google Fonts

Click to open HTML + CSS

12
lato italic
catamaran regular

The words graphic designer, stick in
my throat

giving me a sense of limitation, of specialization within the specialty, of a relationship to society and form itself that is unsatisfactory and incomplete. This inadequate set of terms to describe an active life reveals only partially the still undefined nature of the designer.

Alvin Lustig

View Lato + Catamaran on Google Fonts

Click to open HTML + CSS

13
merriweather regular
mulish light

Good design is a matter of discipline.

It starts by looking at the problem and collecting all the available information about it. If you understand the problem, you have the solution. It’s really more about logic than imagination.

Massimo Vignelli

View Merriweather + Mulish on Google Fonts

Click to open HTML + CSS

14
PT sans italic
bitter regular

No matter how many times your amazing, absolutely brilliant work is rejected

by the client, for whatever dopey, arbitrary reason, there is often another amazing, absolutely brilliant solution possible. Sometimes it’s even better.

Bob Gill

View PT Sans + Bitter on Google Fonts

Click to open HTML + CSS

15
cinzel bold
fauna one

You can set out to make a painting

but you can’t set out to make a great painting,” she said. “If you look at that blank canvas and say, ‘Now I’m going to create a masterpiece’—that’s just foolhardy. You just have to make the best painting you can, and if you’re lucky, people will get the message.

Susan Kare

View Cinzel + Fauna on Google Fonts

Click to open HTML + CSS

16
old standard tt
rubik regular

The real issue is not talent

as an independent element, but talent in relationship to will, desire, and persistence. Talent without these things vanishes and even modest talent with those characteristics grows.

Milton Glaser

View Old Standard + Rubik on Google Fonts

Click to open HTML + CSS

17
work sans light
open sans regular

Asymmetry is the rhythmic expression of functional design.

In addition to being more logical, asymmetry has the advantage that its complete appearance is far more optically effective than symmetry.

Jan Tschichold

View Work Sans + Open Sans on Google Fonts

Click to open HTML + CSS

18
questrial
alegreya regular

The artist constructs a new symbol with
his brush.

This symbol is not a recognizable form of anything which is already finished, already made, already existing in the world - it is a symbol of a new world, which is being built upon and which exists by way of people.

El Lissitzky

View Questrial + Alegreya on Google Fonts

Click to open HTML + CSS

19
oswald regular
quattro cento regular

The grid system is an aid, not a guarantee.

It permits a number of possible uses and each designer can look for a solution appropriate to his personal style. But one must learn how to use the grid; it is an art that requires practice.

Josef Müller-Brockmann

View Oswald + Quattrocento on Google Fonts

Click to open HTML + CSS

20
Nunito LiGHt
pt sans regular

I find going to bed & pulling imagination over my head often means waking up

with a solution to a design problem. That state of limbo, the time between sleeping and waking, seems to allow ideas to somehow outflank the sentinels of common sense. That’s when they can float to the surface.

Alan Fletcher

View Nunito + PT Sans on Google Fonts

Click to open HTML + CSS

21
unica one
crimson text roman

A logo doesn’t sell, it identifies.

A logo derives its meaning from the quality of the thing it symbolizes, not the other way around. A logo is less important than the product it signifies; what it means is more important than what it looks like.

Paul Rand

View Unica + Crimson on Google Fonts

Click to open HTML + CSS

22
julius sans one
Monda regular

Designing is not a profession but an attitude.

Design is the organization of materials and processes in the most productive way, in a harmonious balance of all elements necessary for a certain function.

Laszlo Moholy-Nagy

View Julius + Monda on Google Fonts

Click to open HTML + CSS

23
varela round
Noto serif

If you ever have the good fortune to create

a great advertising campaign, you will soon see another agency steal it. This is irritating, but don't let it worry you; nobody has ever built a brand by imitating somebody else's advertising.

David Ogilvy

View Varela + Noto on Google Fonts

Click to open HTML + CSS

24
vollkorn regular italic
raleway medium

The fun of being a designer is to do something original.

to make images that nobody’s ever seen before. And the only way you’re going to do that is to avoid what the culture tells you is good. There is no good. The good comes from what does the job.

Bob Gill

View Vollkorn + Raleway on Google Fonts

Click to open HTML + CSS

25
ovo regular
quattrocento sans regular

The public is more familiar with bad design than good design.

It is, in effect, conditioned to prefer bad design, because that is what it lives with. The new becomes threatening, the old reassuring.

Paul Rand

View Ovo + Quattrocento on Google Fonts

Click to open HTML + CSS

26
permanent marker
overpass regular

Failure is built into creativity.

The creative act involves this element of ‘newness’ and ‘experimentalism’, then one must expect and accept the possibility of failure.

Saul Bass

View Permanent + Overpass on Google Fonts

Click to open HTML + CSS

27
ubuntu bold
Open sans regular

You have power as a designer

to change the relationship someone has with an object. Your challenge is to keep people looking. Build in those little details. To some people, they might mean a lot.

David Pearson

View Ubuntu + Open Sans on Google Fonts

Click to open HTML + CSS

28
source sans pro black
Sintony regular

If you remember the shape of your spoon at lunch...

it has to be the wrong shape. The spoon and the letter are tools; one to take food from the bowl, the other to take information off the page... When it is a good design, the reader has to feel comfortable because the letter is both banal and beautiful.

Adrian Frutiger

View Source Sans + Sintony on Google Fonts

Click to open HTML + CSS

29
slabo regular
Lato regular

I like stuff designed by dead people.

The old designers. They always got it right because they didn't have to grow up with computers. All of the people that made the spoon and the dishes and the vacuum cleaner didn't have microprocessors and stuff. You could do a good design back then.

John Maeda

View Slabo + Lato on Google Fonts

Click to open HTML + CSS

30
rufina bold
pt serif regular

Designing is a matter of concentration.

You go deep into what you want to do. It's about intensive research, really. The concentration is warm and intimate and like the fire inside the earth - intense but not distorted. You can go to a place, really feel it in your heart. It's actually a beautiful feeling.

Peter Zumthor

View Rufina + PT Serif on Google Fonts

Click to open HTML + CSS

31
dosis regular
Titillium web regular

The most popular typefaces are the easiest to read

their popularity has made them disappear from conscious cognition. It becomes impossible to tell if they are easy to read because they are commonly used, or if they are commonly used because they are easy to read.

Zuzana Licko

View Dosis + Titillium on Google Fonts

Click to open HTML + CSS

32
oswald light
esteban regular

So that is the design process or the creative process.

Start with a problem, forget the problem, the problem reveals itself or the solution reveals itself and then you reevaluate it. This is what you are doing all the time.

Paul Rand

View Oswald + Esteban on Google Fonts

Click to open HTML + CSS

33
playfair display Black
source sans regular

Twenty years from now you will be more disappointed

by the things that you didn’t do than by the ones you did do. So throw off the bowlines. Sail away from the safe harbor. Catch the trade winds in your sails. Explore. Dream. Discover.

Mark Twain

View Playfair + Source Sans on Google Fonts

Click to open HTML + CSS

34
libre baskerville bold
nunito regular

If you don’t get your type warm it will be no use at all

for setting down warm human ideas ... By jickity, I'd like to make a type that fitted 1935 all right enough, but I'd like to make it warm - so full of blood and personality that it would jump at you.

William Addison Dwiggins

View Libre + Nunito on Google Fonts

Click to open HTML + CSS

35
catamaran semibold
merriweather sans light

We are so obsessed with the Net and technology

that we forget the message... We imagine to be able to do anything, and our software helps us believe we can... But we must move beyond the ‘how’ to reconsider the ‘what’ and the ‘why’...

Neville Brody

View Catamaran + Merriweather on Google Fonts

Click to open HTML + CSS

36
bree serif
alegreya regular

My work is play. And I play when I design.

I even looked it up in the dictionary, to make sure that I actually do that, and the definition of “play,” number one, was “engaging in a childlike activity or endeavor,” and number two was “gambling.” And I realize I do both when I’m designing.

Paula Scher

View Bree + Alegreya on Google Fonts

Click to open HTML + CSS

37
cardo regular
libre franklin regular

The contributions that one makes

in typography, design, and art in general cannot be, and must not be measured on how much money is involved. That would lead to total chaos. The word itself (contribution) is to give to a common purpose.

Ed Benguiat

View Cardo + Franklin on Google Fonts

Click to open HTML + CSS

38
istok web regular italic
average regular

Creativity is essentially a lonely art. An even lonelier struggle.

To some a blessing. To others a curse. It is in reality the ability to reach inside yourself and drag forth from your very soul an idea.

Lou Dorfsman

View Istok + Average on Google Fonts

Click to open HTML + CSS

39
roboto Medium
libre baskerville

A designer...has the true responsibility to give his audiences

not what they think they want, for this is almost invariably the usual, the accustomed, the obvious, and hence, the unspontaneous. Rather, he should provide that quality of thought and intuition which rejects the ineffectual commonplace for effectual originality.

Lester Beall

View Roboto + Libre on Google Fonts

Click to open HTML + CSS

40
goudy bookletter
average sans regular

There should be no separation between spontaneous work

with an emotional tone and work directed by the intellect. Both are supplementary to each other and must be regarded as intimately connected. Discipline and freedom are thus to be seen as elements of equal weight, each partaking of the other.

Armin Hofmann

View Goudy + Average Sans on Google Fonts

Click to open HTML + CSS

41
Alfa slab one
gentium book basic

Perfect
typography

is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.

Jan Tschichold

View Alfa Slab + Gentium on Google Fonts

Click to open HTML + CSS

42
raleway light
frank ruhl libre

Having no purpose is the function of art

Having no purpose is the function of art, so somebody else can look at it and ask a question. Design is different - you’re supposed to understand what’s going on. You can be delighted by it, intrigued by it, but you’re supposed to know it’s a hot dog stand.

Paula Scher

View Raleway + Frank on Google Fonts

Click to open HTML + CSS

43
Prata regular
Lato regular

I read once about the concepts of a lateral idea

and a vertical idea. If you dig a hole and it’s in the wrong place, digging it deeper isn’t going to help. The lateral idea is when you skip over and dig someplace else.

Seymour Chwast

View Prata + Lato on Google Fonts

Click to open HTML + CSS

44
shrikhand
Fanwood text

You can say
“I love you,”
in Helvetica.

And you can say it with Helvetica Extra Light if you want to be really fancy. Or you can say it with the Extra Bold if it's really intensive and passionate, you know, and it might work.

Massimo Vignelli

View Shrikhand + Fanwood on Google Fonts

Click to open HTML + CSS

45
eczar semibold
merriweather regular

I think it’s ultimately inhuman to only see things for their functionality.

We want things to be more than that. The desire for beauty is something that’s in us, and it’s not trivial.

Stefan Sagmeister

View Eczar + Merriw. on Google Fonts

Click to open HTML + CSS

46
chivo light
crimson text roman

Just because something is legible doesn’t mean it communicates

Just because something’s legible doesn’t means it communicates.
More importantly, it doesn't mean it communicates the right thing. So, what is the message sent before somebody actually gets into the material? And I think that’s sometimes an overlooked area.

David Carson

View Chivo + Crimson on Google Fonts

Click to open HTML + CSS

47
patua one regular
maven pro regular

The nature of process,
to one degree or another, involves failure.

You have at it. It doesn’t work. You keep pushing. It gets
better. But it’s not good. It gets worse. You got at it again.
Then you desperately stab at it, believing “this isn’t going to
work.” And it does!

Saul Bass

View Patua + Maven on Google Fonts

Click to open HTML + CSS

48
Rubik regular
Karla regular

An electrician isn’t an opinion former, but a graphic designer is.

My argument is that all graphic designers hold high levels of responsibility in society. We take invisible ideas and make them tangible. That’s our job.

Neville Brody

View Rubik + Karla on Google Fonts

Click to open HTML + CSS

49
neuton regular
Work Sans regular

Find out what the next thing is that you can push,

that you can be ignorant about, that you can be arrogant about, that you can fail with, and that you can be a fool with. Because in the end, that's how you grow.

Paula Scher

View Neuton + Work Sans on Google Fonts

Click to open HTML + CSS

50
anton regular
signika light

What I feel fortunate about is that I’m still astonished.

that things still amaze me. And I think that that's the great benefit of being in the arts, where the possibility for learning never disappears, where you basically have to admit you never learn it.

Milton Glaser

View Anton + Signika on Google Fonts

Click to open HTML + CSS

How this post came to be

I love the concept of Google fonts, but I find the execution to always be somewhat lacking. When compared to classics like Futura, Bodoni, Garamon—even Helvetica—they just fall short, and I rarely, if ever, end up using them.

Can you relate?

Who doesn’t love the concept of Google Fonts? The fast download of cool fonts from their high-speed library is great, and has brought far more unique, web-friendly fonts and font pairs to the internet than ever before. They broke us out of the standard web fonts and web safe fonts we were all chained down to a few years back of Arial, Verdana, and Times New Roman.

But because of that feeling of something “lacking” I’ve stayed away from Google fonts. Until now.

For this project, I wanted to create the best font pairings Google has to offer that even high-end agency designers would be tempted to use. I wanted to assemble Google font pairs that even I would have trouble turning down.

So I combed through Google’s vast library and tested hundreds of font combinations, from their most famous and top fonts like the Roboto font, Railway font, Montserrat font, Lato font, Oswald font, Lobster font, and more, to more obscure, funky ones you may have never even seen before this post.

The wonderful Rijks collection

It was also about this time that I came across the Rijks Museum’s online art collection. In short, it’s a beautiful collection of fine art that is 100% royalty free and available for any use you’d like. (Can you say “aaaamazing?”)

I took my favorite pieces from the Rijks collection and combined them with my Google font pairings to create a truly beautiful display of Google fonts that really work. We’ve also organized them by filters to help you find a font to fit that project you’re working on right now. You’ll find dozens of font pairings you can re-use time and time again for different clients and projects.

I undertook one more challenge in this project: to express these font pairings through profound, time-tested quotes on design from world-renowned designers of all styles. So we have beauty in art, functionality in fonts, and wisdom in quotes.

If you too have had trouble finding great Google fonts and combinations, this might win you over to the Google Fonts Team like it won me over. Or maybe not! The beauty of design is that, at the end of the day, our own preferences and styles are what truly matter.

To help you find font pairings, we organized them in two ways: Style (Serif, Sans Serif, Both), and Mood (Any, Modern, Striking, Eccentric, Classic, Minimal, Neutral, Warm).

Here’s a brief explanation of each of these moods:

Modern: Feels like it was made for the 21st century, and wouldn’t make sense in any other period. Typically clean, more on the minimal side, and great for projects that require a more polished feel.

Striking: Impact. Boldness. Weight. These font pairs reach out and grab you and pull you into their message.

Eccentric: Quirky. Odd. Different. These fonts communicate uniqueness in various ways. Great for personal blogs, companies in a crowded marketplace that need to be set apart, and more.

Classic: These font combinations feel like they could have existed for generations. They’re reminiscent of classic, time-tested and weathered fonts that last. Great for projects that need to project confidence, reliability, style.

Minimal: These minimal font pairings say so much, with a whisper. They almost try to blend into the background and get out of the way to help you more purely take in the message. Clean. Concise. Polished.

Neutral: Some brands are like the friendly local baker who greets everyone with a smile. Others are more professional, cerebral. These neutral fonts are more on the cerebral side – conveying professionalism and cleanliness above all else. Think Helvetica, but for Google fonts.

Warm: For brands who are the “friendly local baker,” these fonts are for you. They convey heart, creativity, openness. They say, “Come talk to me, let’s be friends.” Great for brands that have that personal touch.

So there you have it!

Beautiful fonts and combinations from Google you can use to fuel your personal and client projects. They’re completely web-safe fonts, and due to their vast use worldwide, I think it’s safe to say Google fonts are the new standard web fonts.

I hope displaying them on top of various colors, with various beautiful works of art behind them, helped you envision how they might work in your projects. That was one of my biggest goals in creating this post.

An important lesson

That’s actually a lesson that was greatly reinforced in me throughout this Google font quest – that how fonts are used are just as important, if not more so, than the fonts themselves.

I think often Google fonts are strewn across designs that are lacking the fundamentals of good design. They’re the cool, hip thing to use and as a result, so many people us them. But design is a spectrum ranging from bad to great, and as bell curves go, few designs are truly great.

By simple math, most designs using Google fonts need improvement. Perhaps that’s where my initial bias against Google fonts came from. Design is something I take so seriously, and am so passionate about, that when I see bad or lazy design, it hurts. From seeing so much sub-par design riddled with Google fonts, I associated Google fonts with sub-par design.

A new perspective

Undertaking this challenge to create this collection forced me to see Google fonts from a new perspective. Namely, it forced me to throw away my previous conceptions and see them anew. When I did, I simply viewed them like I would anything else in a design as an asset to be used and manipulated to achieve an end-goal.

When I had no choice but to make them work, I viewed them as something that actually “could” work. And that’s where the creativity and magic began.

That leads me to another important lesson I became re-acquainted with in this process: that when we think something won’t work, it won’t work. And when we truly think it can, we really can make it work.

Strategies for choosing font pairs

I also wanted to talk about some of the strategies behind these Google font combinations to help you create even more of your own. While I have 50 here, I’m certain there are dozens more waiting to be made.

If you’ll notice, there’s a pattern to nearly every pair: the headline is very bold and impactful, and then the body font is very light and airy. This contrast creates a nice tension and context for the fonts. It makes it very interesting as you scroll. Our eyes and brains desire constant change and flux and small contrasts like this deliver.

Another reason the body fonts are very light and airy is that they have to be palatable and legible to the eye over the course of a long piece of text. If I throw a bold, impactful font at you for more than 10 or so words – your eye will go crazy. It’s like talking on the phone with someone who only screams.

When you go from a louder headline font to a body font, there’s almost a feeling of relief. The headline was a nice, momentary burst of excitement, but then the eye is relieved to handle something easier and less demanding.

Serif & Sans

In addition, still in line with that concept of contrast, I often paired a serif headline with a sans serif body, or vise versa. Again, this just emphasizes contrast and keeps things interesting.

It also takes things a step further and shifts the feel. Serif fonts tend to feel more grounded, conservative and calm. Sans serif fonts tend to feel more modern, daring, progressive. By paring the two together, you get a great balance that’s interesting to the mind and the eye.

Work with what you (don’t) love

I purposefully chose some fonts I simply thought I’d never like or want to use in any context. If I looked at a font and felt like it was a “heck no” – I felt compelled to give it a try.

This is so important for the creative process. Often, without even realizing it, we confine ourselves to our creative comfort zones, which slowly shrink over time. But when we step outside and try something we thought we’d never like – we often have our biggest breakthroughs.

Thanks so much for viewing this collection.

I hope it’s as useful and enjoyable for you as it was fulfilling for me to create.

I’d love to hear your thoughts, suggestions for other Google font pairs, questions, and more.

Who is Hey Reliable (formerly Reliable PSD)?

Have you ever found yourself in need of someone to convert a design to HTML? We’d love to help! Hey Reliable is a coding company created by creatives, for creatives. We help hundreds of agencies each year by bringing their designs to life through code. We’ve been able to give our customers memorable, positive experiences and a sense of camaraderie they hadn’t experienced before with a design to HTML development partner. Many of our clients become our friends. Our high-precision coders and testers will fill your project with beautiful code that works exactly how it ought to. No more long lists of changes that take months to resolve. Reach out to us and start the convo today.

Questions or comments about this post? We're here for you at info@heyreliable.com!
Send a quick email