Divi Fonts list, guide & preview

There are 1429 Divi Theme fonts included with Divi and you can also upload your own custom fonts to Divi too

The fonts included in Divi are those from the Google fonts list and can be used on any text on your Divi website.

What is the default Divi font?

The default font in Divi is Open Sans which “is a humanist sans serif typeface designed by Steve Matteson,” and just like every Divi font, it can be previewed on the Google Fonts website. Open Sans is the font that is applied to all Divi header and body text unless you change it in the Theme Customizer typography settings.

How many fonts are there in Divi?

Divi has currently 1429 fonts by default which are the same fonts found in the Google Fonts collection.

The number of fonts in Divi will grow as the number available via Google Fonts grows. When a new Google font is added to their collection it will show up and be available to use in the Divi Builder as a divi theme font automatically.

If 1400+ fonts are not enough font options for you, you also have the ability to upload your own custom fonts as either TTF or OTF formats which will give you access to unlimited fonts for your Divi website.

How do I preview a list of Divi fonts?

You can live preview all of the Divi fonts either within the Divi Builder font drop-down lists or by using the official Google Fonts website.

The best way to preview the full Divi fonts list is to use the Google Fonts preview.

This page displays the full collection of fonts and allows you to search, filter, sort, and demo each of the fonts as a grid or list of fonts. Once you have chosen your font here you can then use the dropdown in the Divi Builder to select your font within your website.

Alternatively, when using the Divi Builder the Divi fonts preview will show in any modules that has text options.

To preview the fonts in the Divi Builder you need to go into the Design settings tab and click on the Text or Heading Text sections. You will then see a drop-down menu for either the Text Font or Text Heading Font where you can see all Divi font options.

As you hover over each font in the drop-down list you will see the live preview load. 

How do I change the global default fonts?

1. In your WordPress admin area go to Appearance > Customize to load the Theme Customizer (or click on Theme Customizer in the front-end admin menu)
2. Go to General Settings > Typography
3. Scroll down Header Font or Body Font sections
4. Click on each drop-down menu and select your global header and body fonts. You can use the font search box at the top if you know the name of the font you wish to use.
5. Click “Save and Publish” and your global default fonts will be saved.

Whilst you are in the Typography settings tab of the Theme Customizer you can also set global body text size, body line height, header text size, header letter spacing, header line height, header font style, body link color, body text color, and header text color.

How to upload a new custom font in Divi?

If Divi doesn’t have the particular font you need to use, you can add your own custom fonts within the Divi Builder. Supported font file formats are TTF (TrueType Font) and OTF (OpenType Font) files but you can use an online font converter if it is another font format.

To upload and add your own custom font into the Divi font list you will need to follow the steps below.

1. Open any module with a text component
2. Go to the Design tab then click on either of the Text or Heading Text sections
3. Click on the Text Font or Heading Text Font drop-down menus
4. Click on the Upload button at the top of the drop-down menu
5. In the pop-up, you can give your new font a name and select the font file to upload
6. Hit upload and your font will be added to the list of Divi fonts.

What are the best fonts for Divi?

What the best Divi fonts are is really a personal choice, but by viewing the Google fonts analytics page you can see what the most popular fonts are. This site lists all Google fonts sorted by how many people are using them and allows you to select from the past 7, 30, 90 days, and 1-year statistics.

Using this ranked list is a great way to select which is the best font to use for your website when you are having trouble deciding from the huge number of options. Popular fonts are popular for a reason, so if you pick a font from the top of this list you should be confident that you will be using a quality font.

Top 10 Divi & Google fonts for 2022

1. Roboto
   Font Styles: 12 Thin, Thin Italic, Light, Light Italic, Regular, Regular Italic, Medium, Medium Italic, Bold, Bold Italic, Black, Black Italic
2. Open Sans
   Font Styles: 10 Light, Light Italic, Regular, Regular Italic, Semi-Bold, Semi-Bold Italic, Bold, Bold Italic, Extra-Bold & Extra-Bold Italic
3. Lato
   Font Styles: 10 Thin, Thin Italic, Light, Light Italic, Regular, Regular Italic, Bold, Bold Italic, Black, Black Italic
4. Montserrat
   Font Styles: 18 Thin, Thin Italic, Extra-Light, Extra-Light Italic, Light, Light Italic, Regular, Regular Italic, Medium, Medium Italic, Semi-Bold, Semi-Bold Italic, Bold, Bold Italic, Extra-Bold, Extra-Bold Italic, Black, Black Italic
5. Noto Sans JP
   Japanee language
6. Roboto Condensed
   Font Styles: 6 Light, Light Italic, Regular, Regular Italic, Bold, Bold Italic
7. Oswald
   Font Styles: 6 Extra-Light, Light, Regular, Medium, Semi-Bold, Bold
8. Source Sans Pro
   Font Styles: 12 Extra-Light, Extra-Light Italic, Light, Light Italic, Regular, Regular Italic, Semi-Bold, Semi-Bold Italic, Bold, Bold Italic, Black, Black Italic
9. Slabo 27px
   Font Styles: 1 Regular
10. Raleway
    Font Styles: 18 Thin, Thin Italic, Extra-Light, Extra-Light Italic, Light, Light Italic, Regular, Regular Italic, Medium, Medium Italic, Semi-Bold, Semi-Bold Italic, Bold, Bold Italic, Extra-Bold, Extra-Bold Italic, Black, Black Italic

How to choose the best header and body font pairs?

You have the ability to use as many fonts as you like in your Divi website but good design practice means you will likely want to set one font for your text headings (H1, H2, H3, H4, etc) and one for your body text (p). The selection of these 2 fonts is known as font-pairing and they should compliment each other for good styling.

With so many Google/Divi fonts listed in the official Google font repository and available to choose from in Divi it can be daunting to pick the best font combination for your website.

There are a few resources online to help pick font pairs such as the Font Pair website and the Google article on pairing typefaces.

The Font Pair website allows you to browse in various font category pairs such as Sans-Serif/Serif Serif/Sans-Serif Sans-Serif/Sans-Serif Display/Sans-Serif etc. You can also search for a particular font that will give you all available font pairs using your selected font.

Final thoughts on Divi fonts

Divi allows you access to the full list of Google fonts which is very extensive and perhaps even too extensive. On several site I use the default open sans font and am happy with the simple look it gives.

What are your favorite fonts for Divi?

*This post was originally published in April 2015