These 30 sans-serif fonts for headings are grouped by letterform style: neutral, geometric, grotesque, condensed and heavy, and technical and humanist. Each entry says whether the font is static or variable and gives its axis ranges.
Every font is free for commercial use and licensed under the Open Font License, except Ubuntu, which uses the Ubuntu Font License, and Aileron and Penna, which are CC0 public domain.
Neutral Sans Serif Fonts
Plain, even letterforms with no decorative features. Most are also text fonts, and they differ mainly in weight range and axes.
1. Inter
Inter is a variable font with an optical size axis from 14 to 32 and a weight axis from 100 to 900. The optical size axis changes the drawing between small text and large headlines. Its lowercase has a tall x-height and a single-story g.
Price: FREE ǀ Go to Inter
2. Roboto
Roboto is a variable font with two axes: width from 75 to 100 and weight from 100 to 900. Its round letters such as o and e have flattened, squarish sides. The width axis lets a long heading narrow to 75 to fit a column.
Price: FREE ǀ Go to Roboto
3. Open Sans
Open Sans has a width axis from 75 to 100, and a weight axis from 300 to 800, so its lightest weight is a plain light rather than a hairline. The letters are wide and open, with a large x-height and a double-story g.
Price: FREE ǀ Go to Open Sans
4. Lato
Lato ships as nine static weights from 100 to 900, with no variable build, so every weight you load is its own file. The curves are soft, and the stroke ends are cut flat rather than rounded. Weight 100 is a true hairline.
Price: FREE ǀ Go to Lato
5. PT Sans
PT Sans comes in two static weights, Regular and Bold, and nothing between them. That means a heading and its emphasis are the only two weights you can set. The letters are humanist, with slight variation in stroke width.
Price: FREE ǀ Go to PT Sans
6. Ubuntu
Ubuntu has four static weights: Light, Regular, Medium, and Bold. Its lowercase l ends in a curved tail. The license is the Ubuntu Font License, which is free for commercial use, but is not the Open Font License. Ubuntu Sans is the variable version, with a width axis from 75 to 100, a weight axis from 100 to 800, and the same license.
Price: FREE ǀ Go to Ubuntu
7. Overpass
Overpass is a variable font with one axis, weight, running from 100 to 900. It has no width or optical size axis. The strokes are of even thickness, and the curves are squared off.
Price: FREE ǀ Go to Overpass
8. Aileron
Aileron’s letterforms are close to Helvetica’s. It is not on Google Fonts, so it is a direct download, a zip of OTF files, and it is public domain under CC0 with no rights reserved. It is static, with eight upright weights from UltraLight to Black.
Price: FREE ǀ Go to Aileron
Geometric Sans Serif Fonts
Geometric sans serifs draw their round letters, especially o, close to a perfect circle. The fonts below differ mainly in width and weight range.
9. Montserrat
Montserrat has wide, round capitals, which make a short heading fill a lot of horizontal space. It is a variable font with a single weight axis from 100 to 900.
Price: FREE ǀ Go to Montserrat
10. Poppins
Poppins is a static family of nine weights from 100 to 900, each one in its own file. The o is close to a circle, the g is single-story, and the a is double-story.
Price: FREE ǀ Go to Poppins
11. Raleway
Raleway is a variable font with a weight axis from 100 to 900, and its thin end is a hairline. Its lowercase has a lower x-height than Inter or Open Sans, so the capitals stand taller against it.
Price: FREE ǀ Go to Raleway
12. Sora
Sora has wide, round letterforms and a variable weight axis from 100 to 800. Its axis stops at 800.
Price: FREE ǀ Go to Sora
13. Plus Jakarta Sans
Plus, Jakarta Sans is a variable font with a weight axis from 200 to 800. It has no 100 hairline, so its lightest heading weight keeps a visible stroke. The bowls are round, and the strokes are even.
Price: FREE ǀ Go to Plus Jakarta Sans
14. Manrope
Manrope has more compact letters than Montserrat or Sora, so the same heading takes less width. It is a variable font with a weight axis from 200 to 800, the same range as Plus Jakarta Sans.
Price: FREE ǀ Go to Manrope
15. Capriola
Capriola has soft, rounded letter shapes and a variable weight axis from 300 to 700. That range has no hairline and no black.
Price: FREE ǀ Go to Capriola
Grotesque Sans Serif Fonts
Grotesque sans serifs have flat-cut terminals and less regular proportions than the geometric fonts above. The three below each have a different axis setup.
16. Archivo
Archivo is a variable font with a width axis from 62 to 125 and a weight axis from 100 to 900. That width range is the widest of any variable font on this page, running both narrower and wider than normal.
Price: FREE ǀ Go to Archivo
17. Space Grotesk
Space Grotesk draws its capital N with a diagonal much thinner than its stems, which shows in any heading that contains the letter. It is a variable font with a weight axis from 300 to 700, so the heaviest cut is Bold.
Price: FREE ǀ Go to Space Grotesk
18. Bricolage Grotesque
Bricolage Grotesque is the only font on this page with three axes: optical size from 12 to 96, width from 75 to 100, and weight from 200 to 800. The optical size axis refines the letters for large headlines.
Price: FREE ǀ Go to Bricolage Grotesque
Condensed And Heavy Sans Serif Fonts
Condensed, heavy, or both, and most ship in a single weight. For heavier faces still, see these block letter fonts.
19. Bebas Neue
Bebas Neue contains capital letters only, so lowercase text typed in it appears as capitals. It is static, with a single weight, and the letters are tall and narrow.
Price: FREE ǀ Go to Bebas Neue
20. Oswald
Oswald is condensed but has a full lowercase, which Bebas Neue lacks. It is a variable font with a weight axis from 200 to 700.
Price: FREE ǀ Go to Oswald
21. Anton
Anton is a very heavy condensed face with tall, tightly packed capitals and small counters. It is static with a single weight, so the heaviness is fixed.
Price: FREE ǀ Go to Anton
22. Fjalla One
Fjalla One is condensed with a stroke weight between the hairline of Wire One and the heaviness of Anton. It has a full lowercase and ships as a static single weight.
Price: FREE ǀ Go to Fjalla One
23. Wire One
Wire One is a very thin, condensed face, and its stroke is the lightest in this group. It is static with a single weight, so it cannot be thickened.
Price: FREE ǀ Go to Wire One
24. Paytone One
Paytone One is heavy, rounded, and wide, the opposite of the narrow faces around it. It is the only wide face in this group. It ships as a static single weight.
Price: FREE ǀ Go to Paytone One
Technical And Humanist Sans Serif Fonts
Exo and Quantico use squared, angular shapes. Allerta, Belleza, and Gudea are humanist, with stroke widths that vary the way a pen’s do. Penna is a very thin display face.
25. Exo
Exo has rounded-square curves and angled corners, which give its letters a technical outline. It is a variable font with a weight axis from 100 to 900.
Price: FREE ǀ Go to Exo
26. Quantico
Quantico has squared letters with cut corners and a uniform stroke. It is static, with two weights, Regular and Bold. The angled corners are visible even in a short word.
Price: FREE ǀ Go to Quantico
27. Allerta
Allerta has open, wide-set humanist shapes in a single static weight. There is no Bold to pair with it, so emphasis has to come from size or color.
Price: FREE ǀ Go to Allerta
28. Belleza
Belleza has visible thick and thin strokes, and its single weight is light. It is static, so there is no bold.
Price: FREE ǀ Go to Belleza
29. Gudea
Gudea has humanist letters whose stroke width varies, unlike the uniform squares of Quantico. It is static, with two weights, Regular and Bold.
Price: FREE ǀ Go to Gudea
30. Penna
Penna is a very thin geometric face with a single weight, and its strokes are too fine to hold up at small sizes. It is not on Google Fonts. It is a direct download of a single OTF file, released as public domain under CC0 with no rights reserved.
Price: FREE ǀ Go to Penna
Variable Fonts Cover Every Heading Level
Fifteen of these 30 fonts are variable: Inter, Roboto, Open Sans, Overpass, Montserrat, Raleway, Sora, Plus Jakarta Sans, Manrope, Capriola, Archivo, Space Grotesk, Bricolage Grotesque, Oswald and Exo. A variable font holds a whole weight range in one file, so an H1, an H2 and an H3 can sit at different weights of the same family without loading three files. A font with a width axis, such as Archivo, Roboto, Open Sans or Bricolage Grotesque, can narrow a long heading to fit a column. The other fifteen are static, so each weight is its own file. See 10 Best Variable Fonts For Web Design for more variable options.
Adding These Fonts To Your Site
Twenty-eight of the 30 fonts are on Google Fonts. In Divi, Google Fonts are built into the font picker, so you select them from the dropdown with nothing to install. Aileron and Penna are not on Google Fonts, so download the zip and upload the font file. Divi takes a font file as an upload and lists it in the font picker like any other option.
Outside of Divi, there are two ways to add a font to WordPress. One is an @font-face rule in CSS. The other is a plugin that takes the uploaded files and writes that code, such as Use Any Font.
Test Three Fonts At H1 Size
Pick two or three fonts from the list and set your real headline in each at H1 size. Compare them side by side, because the actual words and their length decide which one fits. Check the heading at both a desktop and a phone width, since the same font wraps differently on each screen. For premium and business-document faces, see these professional fonts for upscale web designs.
4 of these are from: thenorthernblock.co.uk/fonts !!
– Corbert
– Baufra
– Bitner
– DyeLine
Thanks for sharing them Tom!
No problem, Scott!
thanks for Sharing, Tom!
Bebas Neue is my go-to for Youtube Thumbnails.
Excellent article, it’s always very frustrating for me to choose a font because in my mind, they all deliver the same message. However, I know that to be false and generally ask someone more creative than myself to choose the font :P.
If I use Use Any Font, how can I change the font of the main menu?
Hi Tal,
I’m afraid I’m not sure what you’re asking – are you referring to the menu text of your theme?
Cheers,
Tom
Hi, lovely fonts. But how can I get these amazing fonts in Divi?
With regards
Thank you for framing this article as you have. Much better than your serif article. Nice variety of fonts, too.
Just one point: Use Any Font is pay plugin and quite useless, free version only 1 font family. It should be mentioned in the post. Check Google Fonts form more falilies.
The materials were of great help
Beautiful new suggestions. Thank you so much!
You’re welcome Anja 🙂
Overpass, I choose you!
I think this font is the most suitable font for website, especially wordpress. Many people use TNR or Calibri or other fonts that I didn’t know. The most cool one is Overpass, the design is simple and also elegant for me 😀
Glad you like it Vitta!
Great collection. Mentioning the font range (latin, cyrillic, … ) would be very helpful to international readers.
Great Collection, I would always recommend this post if anyone is looking for best fonts for their blogs and also these days most of the wordpress themes comes with inbuilt google fonts future
I very love this blog….one of my fav when surfing internet. Thank you so much!
Thanks, Tom for a great article! Could you also do one on Body Text fonts? Readability at small sizes and uniqueness to stand apart from Default Sans would be helpful…
Nice idea Randy – I’ll see if we can work on that!
Nice! Thanks for this.
Great font collection. Thank you for taking the time to research and share.
Awesome tips in fonts.
This is amazing font use!! One of the best blogs to follow. Thank you
I agree. It’s what compelled me to join them. Now how can I make such a great blog for my site…hmmm