Font Suggestions

Here are a few suggestions for free Google fonts that you could consider using on your website.

Multipurpose Fonts (Headings and Body Text)

If in doubt about how to combine different typefaces then you could try picking just one from this section and using the bold version for headings.

Cabin

https://fonts.google.com/specimen/Cabin/about?query=cabin

https://www.typewolf.com/cabin


Figtree

https://fonts.google.com/specimen/Figtree/about?query=figtree

https://www.erikdkennedy.com/projects/figtree.html


Fira Sans

https://fonts.google.com/specimen/Fira+Sans/about?query=fira+sans

https://www.typewolf.com/fira-sans


Geologica

https://fonts.google.com/specimen/Geologica/about?query=Geologica


Inter

https://fonts.google.com/specimen/Inter/about?query=inter

https://www.typewolf.com/inter


Lato

https://fonts.google.com/specimen/Lato/about?query=lato

https://www.typewolf.com/lato


Montserrat

https://fonts.google.com/specimen/Montserrat/about?query=Montserrat

https://www.typewolf.com/Montserrat


Noto Sans

https://fonts.google.com/noto/specimen/Noto+Sans/about

https://www.typewolf.com/noto-sans


Nunito Sans

https://fonts.google.com/specimen/Nunito+Sans/about?query=nunito


Open Sans

https://fonts.google.com/specimen/Open+Sans/about?query=open+sans

https://www.typewolf.com/open-sans


Poppins

https://fonts.google.com/specimen/Poppins/about?query=poppins

https://www.typewolf.com/poppins


Raleway

https://fonts.google.com/specimen/Raleway/about?query=raleway

https://www.typewolf.com/raleway


Roboto

https://fonts.google.com/specimen/Roboto/about?query=roboto

https://www.typewolf.com/roboto


Work Sans

https://fonts.google.com/specimen/Work+Sans/about?query=work+sans

https://www.typewolf.com/work-sans


Lora

https://fonts.google.com/specimen/Lora/about?query=Lora

https://www.typewolf.com/Lora


PT Serif and PT Sans

https://fonts.google.com/specimen/PT+Serif/about?query=PT+Serif

https://www.typewolf.com/PT-Serif

https://fonts.google.com/specimen/PT+Sans/about?query=pt+sans

https://www.typewolf.com/pt-sans


Source Serif and Source Sans

https://fonts.google.com/specimen/Source+Serif+4/about

https://www.typewolf.com/source-serif-pro

https://fonts.google.com/specimen/Source+Sans+3/about

https://www.typewolf.com/source-sans-pro



Mainly for Headings

Abril Fatface

https://fonts.google.com/specimen/Abril+Fatface


Archivo Black


Bevan

https://fonts.google.com/specimen/Bevan/about?query=bevan


Bodoni Moda

https://fonts.google.com/specimen/Bodoni+Moda/about


Cabin Sketch

https://fonts.google.com/specimen/Cabin+Sketch/about?query=cabin+sketch


Cardo

https://fonts.google.com/specimen/Cardo/about?query=cardo

https://www.typewolf.com/cardo


DM Serif Text

(Note that DM Serif Display could be used instead for large headings)

https://fonts.google.com/specimen/DM+Serif+Text/about


Josefin Sans

https://fonts.google.com/specimen/Josefin+Sans/about?query=Josefin+Sans


League Spartan

https://fonts.google.com/specimen/League+Spartan/about


Limelight

https://fonts.google.com/specimen/Limelight/about


Playfair Display

https://fonts.google.com/specimen/Playfair+Display/about?query=playfair+display

https://www.typewolf.com/playfair-display


Prata

https://fonts.google.com/specimen/Prata/about?query=prata

https://www.typewolf.com/prata


Special Elite

https://fonts.google.com/specimen/Special+Elite/about


Some Useful Links

Google Fonts
Making the web more beautiful, fast, and open through great typography
fonts.google.com
The 40 Best Google Fonts—A Curated Collection for 2023 · Typewolf
A curated collection of the absolute best free fonts available on Google Fonts in 2023—open-source and 100% free for commercial use.
www.typewolf.com
Font Pairs
wbcollective.dev
The Ultimate Collection of Google Font Pairings (Displayed Beautifully with Classic Art)
An Ultimate Collection of Google Font Pairs and Combinations! Save a tremendous amount of time, energy, and effort with our awesome 50 font pairings.
reliablepsd.com
Pairing typefaces using the font matrix – Fonts Knowledge – Google Fonts
A detailed approach to combining typefaces based on their construction.
fonts.google.com
Learn to use the Power of Typography – Pimp my Type
Boost your web & app designs with pimped typography. Weekly font recommendations on Font Friday, articles & videos by Oliver Schöndorfer.
pimpmytype.com
The Font Series Guide: Introduction | Designerly
The Font Series is an in-depth guide on specific fonts and their uses throughout time. Typography will continue to dominate our world.
designerly.com
Google Web Fonts font pairing | Typ.io
164 samples of typography that use fonts from the Google Web Fonts service.
typ.io
Interactive Typography Tutorial – Learn UI Design
An interactive tutorial on typography, including how to pick great fonts, styling text, and typographical design patterns in UI design.
learnui.design
CHOOSING FONTS FOR YOUR DESIGN PROJECT
Do you find choosing fonts hard? Check out our insider guide to selecting fonts plus lots of go-to tricks.
thedesignspace.co
The Surprising Truth About Pixels and Accessibility: should I use pixels or rems?
“Should I use pixels or rems?”. In this comprehensive blog post, we’ll answer this question once and for all. You’ll learn about the accessibility implications, and how to determine the best unit to use in any scenario.
www.joshwcomeau.com
Font Playground at Fontstorage.com
Testing and selecting of fonts combinations, typography prototyping for website.
fontstorage.com
Type Scale – A Visual Calculator
Preview and choose the right type scale for your project. Experiment with font size, scale and different webfonts.
typescale.com