Back to Support Design Your Site Change Your Site's Fonts

Change Your Site’s Fonts

The style of the text characters on your website is known as the font. This guide will show you how to choose the fonts for your site.

Fonts and Plan Eligibility

Sites with our Premium, Business, and Commerce plans can choose from a large selection of fonts for their website, but not upload their own custom fonts.

To upload custom fonts and install font styles from Google Fonts, upgrade to the Business or Commerce plan.

Change Your Fonts

You can change the fonts of your site using the steps below.

To determine which section of this guide to follow, visit your dashboard and check under Appearance on the left side. If you find Editor here, use the Site Editor section of this guide. Otherwise, use the Page Editor or Customizer instructions.

If your site uses a theme that supports the site editor, you can use the Styles option to change change your fonts on your site. To change your site’s fonts, follow these steps:

  1. Visit your WordPress.com dashboard.
  2. Go to Appearance → Editor.
  3. Click on Styles on the left, or select the Styles icon that looks like a black-and-white circle.
  4. Select the “Typography” option.
  5. Choose from the following text elements on your site:
    • Text
    • Links
    • Headings
    • Captions
    • Buttons
  6. Click the dropdown under “Font” and choose your desired font. The text will update to your chosen font for you to see how it looks.
  7. Click the “Save” button.

These steps are demonstrated in the video below:

An arrow points to the Styles button in the Site Editor. The icon is a black and white circle.
The Styles icon
Changing fonts in the Site Editor

See our Styles guide for more detailed information on everything you can do to adjust the appearance of text on your website.

Apply a Font to Specific Text

When choosing fonts, you’ll see options to set the fonts for your overall site, not for individual pages or a specific line of text. This is a best practice when it comes to design — websites look best when there is consistency with the fonts across the entire site. If a site had a bunch of different fonts, it could get unwieldy.

If your goal is to make a piece of text stand out, consider other ways of doing so, such as applying different colors, using a Heading or Quote block, or inserting an image.

Upload Custom Fonts

This section of the guide applies to sites with the WordPress.com Business and Commerce plan, and the legacy Pro plan. If you have a Business plan, make sure to activate it. For sites on the Free, Personal, and Premium plans, upgrade your plan to access this feature.

You will find a large selection of font styles for your website. If you would like more fonts to choose from, you can install or upload custom fonts directly through the Site Editor.

Our guide will show you how to install, upload, and manage custom fonts.

Flash of Unstyled Text

Flash of Unstyled Text (FOUT) is when a different font briefly appears before your chosen font appears. The text is displayed in the theme’s default font on slower connections first. This way, people can start reading your content before your chosen font loads instead of waiting while looking at a blank page. This might mean that there’s a flash of a different font before the page finishes loading, but overall this is better for viewers on slower connections than seeing a blank screen.

If you don’t want this to happen, you can add this CSS code to your site with eligible plans, using the CSS Editor in Appearance → Customize → Additional CSS:

.wf-loading body { visibility: hidden; }

or

html:not(.wf-active) body { display: none; }

Google Fonts and GDPR

All requests to serve Google Fonts used in WordPress.com themes are served through WordPress.com’s servers and no longer use Google’s CDN/FDN. This change was made in December 2022.

If your site uses a custom plugin or third-party theme, verify with the plugin and/or theme developers to ensure they are not serving Google Fonts through Google’s CDN/FDN. You can learn more about GDPR here.

Was this guide helpful for you?

Not quite what you're looking for? Get Help!

Copied to clipboard!