The Ultimate Collection of Google Font Pairings
Displayed Beautifully with Classic Art
RELIABLE HAS BEEN FEATURED IN
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!
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 VignelliClick to open HTML + CSS
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 RandClick to open HTML + CSS
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.
View Playfair + Source Sans on Google Fonts
Click to open HTML + CSS
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 VignelliClick to open HTML + CSS
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 GlaserClick to open HTML + CSS
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 ScherView Ruda + Roboto Slab on Google Fonts
Click to open HTML + CSS
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 BassClick to open HTML + CSS
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 SagmeisterClick to open HTML + CSS
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 CarsonClick to open HTML + CSS
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 KiddClick to open HTML + CSS
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 CarsonClick to open HTML + CSS
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 LustigClick to open HTML + CSS
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 VignelliView Merriweather + Mulish on Google Fonts
Click to open HTML + CSS
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 GillClick to open HTML + CSS
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 KareClick to open HTML + CSS
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 GlaserView Old Standard + Rubik on Google Fonts
Click to open HTML + CSS
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 TschicholdClick to open HTML + CSS
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 LissitzkyClick to open HTML + CSS
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-BrockmannView Oswald + Quattrocento on Google Fonts
Click to open HTML + CSS
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 FletcherClick to open HTML + CSS
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 RandClick to open HTML + CSS
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-NagyClick to open HTML + CSS
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 OgilvyClick to open HTML + CSS
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 GillClick to open HTML + CSS
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 RandView Ovo + Quattrocento on Google Fonts
Click to open HTML + CSS
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 BassClick to open HTML + CSS
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 PearsonClick to open HTML + CSS
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 FrutigerView Source Sans + Sintony on Google Fonts
Click to open HTML + CSS
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 MaedaClick to open HTML + CSS
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 ZumthorClick to open HTML + CSS
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 LickoClick to open HTML + CSS
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 RandClick to open HTML + CSS
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 TwainView Playfair + Source Sans on Google Fonts
Click to open HTML + CSS
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 DwigginsClick to open HTML + CSS
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 BrodyView Catamaran + Merriweather on Google Fonts
Click to open HTML + CSS
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 ScherClick to open HTML + CSS
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 BenguiatClick to open HTML + CSS
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 DorfsmanClick to open HTML + CSS
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 BeallClick to open HTML + CSS
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 HofmannView Goudy + Average Sans on Google Fonts
Click to open HTML + CSS
Perfect
typography
is certainly the most elusive of all arts. Sculpture in stone alone comes near it in obstinacy.
Jan TschicholdClick to open HTML + CSS
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 ScherClick to open HTML + CSS
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 ChwastClick to open HTML + CSS
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 VignelliClick to open HTML + CSS
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 SagmeisterClick to open HTML + CSS
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.
Click to open HTML + CSS
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!
Click to open HTML + CSS
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 BrodyClick to open HTML + CSS
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 ScherClick to open HTML + CSS
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 GlaserClick 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.