🎉 Try Slides With Friends — Icebreakers, Team Building Games, Wordclouds & more! Check it out →

Free CSS Font Stacks

Css Font Stacks Preview 1
  • Image Thumbnail
  • Image Thumbnail
  • Image Thumbnail
  • Image Thumbnail
  • Image Thumbnail
  • Image Thumbnail
  • Image Thumbnail

Combining two fonts which compliment each other can sometimes be a tricky task, there is often a lot of trial and error involved and studying the minute details of multiple typefaces. We want to take some of the stress out of this aspect of your design by providing you with 20 ready to use font stacks.

These font stacks go beyond merely pairing two complimentary typefaces together, they include font sizes, margins and colors for all of the most common typography HTML elements (<h1-6>, <p>, <blockquote>, <mark>, <small> etc.). 

Each carefully selected font stack is provided as a barebones .css file which you can include into your projects. Check out the live demo and download them for free.

All of the fonts used are completely free and available via Google Fonts.

More font pairings

View our post 10 Exquisite Font Pairings and Why They Work so Well for more examples and explanations of what makes them work so well

Free License

Feel free to download and use this item for both personal and commercial projects with attribution back to MediaLoot. Please note:

  • Attribution is required for free items. For a non-attribution license, please become a member or buy the full version.
  • You may not distribute or offer this set for download on other websites. Promotion is always appreciated, but please send people to this page.


Don't Miss Another Freebie - Sign Up for Our Newsletter!

Make sure you don't miss out on future free resources by signing up for our weekly newsletter.


You've successfully logged in!