How to change font size in WordPress

The short answer

For text you wrote in a page or post, select it and use the Size setting in the sidebar.

For text your theme controls, such as a menu, a footer, or a widget title, there is often no setting. You add a few lines of custom CSS (the code that controls how a page looks). All three ways are below.

Change one paragraph or heading

1. Open the page or post in the WordPress editor.
2. Click the paragraph or heading you want to change.
3. In the sidebar on the right, find Typography, then Size.
4. Pick a preset size, or enter your own number.
5. Click Save or Update.

If you do not see the sidebar, click the settings icon at the top right of the editor.

Change text across the whole site

This works if your theme is a block theme, which most newer WordPress themes are.

1. Go to Appearance, then Editor.
2. Open Styles, then Typography.
3. Choose the kind of text to change, such as Text or Headings, and set its size.
4. Click Save.

If you see Customize under Appearance and no Editor, you have a classic theme. Its font settings, if it has any, are inside Customize.

Change text your theme has no setting for

Custom CSS needs two things: a selector, which names the text to change, and the new size.

1. Open your live site in Chrome. Right-click the text and choose Inspect.
2. In the panel that opens, find the class name on the highlighted line. For a footer it might be site-footer.
3. Open Additional CSS. With a block theme: Appearance, Editor, Styles, the three-dot menu, Additional CSS. With a classic theme: Appearance, Customize, Additional CSS.
4. Paste the code below. Replace the class name with yours and the size with the one you want.
5. Click Save or Publish.

.site-footer p {
  font-size: 18px;
}

WordPress.com's own instructions are in its help article, Add and Edit CSS in WordPress. On WordPress.com, whether you can add custom CSS depends on your plan.

The easier way: click the text and drag a slider

The hard part of the steps above is finding the right class name and writing the code without a typo. NudgeCSS is a Chrome extension that does that part for you.

1. Install NudgeCSS and open your live site in Chrome. Use the public address, not the WordPress editor.
2. Click the NudgeCSS icon, then click the text you want to change.
3. Under Typography, drag the Font Size slider. The text changes on the page as you drag.
4. Click Export Changes, choose the CSS Patch tab, and click Copy to Clipboard.
5. Paste it into Additional CSS and click Save.

Resizing and previewing text is free. Exporting the code is part of NudgeCSS Studio, which is $30, paid once. You can try the Studio editing tools free for 7 days before you decide.

Common questions