How to change text color in WordPress, from one word to the whole site

Updated October 30, 2026

You can change the text color in WordPress for a single word in 4 clicks, or for every page on the site in about 2 minutes. The trick is picking the right level, because there are 4 of them:

• A few words: Highlight in the block toolbar.
• One block: the block's color setting in the sidebar.
• The whole site: Styles in the Site Editor (block themes) or Appearance → Customize (classic themes).
• Elementor pages: the widget's Style tab.

Most people start at the bottom and work up, coloring paragraphs one at a time. But a color you set on one block overrides the site-wide color for good, until you clear it. So if the goal is "all body text dark gray", set it once in Styles and leave the blocks alone. You'll thank yourself the next time the brand colors change.

Color a few words

Highlight works in any block with text, like paragraphs, headings and list items.

1. Select the words.
2. In the block toolbar, click the small down arrow (More rich text options).
3. Click Highlight.
4. On the Text tab, pick a color, or click the swatch at the top and type a hex code.

The Background tab next to it colors behind the words instead. To remove it, select the words again and click Clear.

Color one block

1. Click the block.
2. If the right-hand panel is closed, click Settings beside Save or Publish.
3. Find the color control. It moved recently:
   • WordPress 7.0 and later: open Typography and click Color.
   • WordPress 6.x: switch to the Styles tab (the half-filled circle icon) and open Color → Text.
4. Pick from the palette, or click the large swatch to enter your own value.

If your text and background are too close, WordPress shows a contrast warning under the picker. Light gray on white looks elegant on a 27-inch monitor and disappears on a phone in the sun, so take the warning seriously.

Change the color for the whole site

Block themes

If your theme edits through Appearance → Editor, it's a block theme, and site-wide color lives there.

1. Open Appearance → Editor and choose Styles from the menu or the half-circle icon.
2. Click Colors.
3. Under Elements, click Text and pick a color.
4. Save.

Check your headings and links straight after. In Twenty Twenty-Five, headings don't have a color of their own and links are set to follow the text color, so changing Text recolors both. If you want them to stay as they were, set Headings and Links under Elements too. Other block themes vary, so look at the preview before you save.

To change one kind of block everywhere, every Quote block for example, go to Styles → Blocks, pick the block and set its color there.

Classic themes

Classic themes don't have Styles. Go to Appearance → Customize and look for a Colors section. Whether it's there, and what it controls, is up to the theme. Plenty only offer a background color.

If yours has no text color option, open Additional CSS in the same Customizer and add:

body {
  color: #1f2937;
}

That catches most body text. Some themes color paragraphs directly, so you may need something more specific, like .entry-content p. The custom CSS guide covers the other places CSS can go.

Elementor

1. Click the widget, a Text Editor or Heading for example.
2. Open the Style tab in the left panel.
3. Set Text Color.

That's one widget at a time, which gets old across a site full of landing pages. Kitepod's Elementor support reads and writes those layouts through Elementor's own save code.

Or ask your assistant

The slow part of a site-wide color change is rarely the setting. It's finding the blocks someone colored by hand years ago, which keep the old color no matter what you set in Styles.

Kitepod lets Claude or ChatGPT do both halves in one request:

Kitepod can read every post and page, so the assistant can find blocks with a hand-set color and show you the list before touching them. Clearing them is a content edit, so it runs straight away, but every block it touches is snapshotted and stays reversible for 90 days. The site-wide color is a design change: it's staged on a preview, and nothing goes live until you publish it.

What goes wrong

• Some paragraphs didn't change. They have their own color, and a block's own color beats Styles. Click one, open its color control and clear it.
• Your headings and links changed too. Your theme lets them follow the text color. Set them separately under Styles → Colors → Elements.
• Appearance → Customize is missing. Block themes hide the Customizer, so go to Styles in the Site Editor.
• The body rule does nothing to your paragraphs. The theme colors them with a more specific selector. Inspect a paragraph in your browser to see which one, and target that.
• The editor shows the new color and the live site doesn't. Purge the page cache (plugin, host or CDN) and reload.

Finer points

Can I color a single word in WordPress?

Yes. Select the word, click the down arrow in the block toolbar, choose Highlight and pick a color on the Text tab.

Why can't I find the text color option in WordPress 7?

It moved. From WordPress 7.0, a block's text color sits in the Typography section of the sidebar instead of its own Color panel.

Can I use a hex code instead of the palette?

Yes. Click the large swatch at the top of the color picker and type the value. To reuse a brand color, add it to the palette under Styles → Colors → Palette.

Does changing the site text color change links and headings?

It can. In Twenty Twenty-Five, links follow the text color and headings have no color of their own, so both change with it. Set Headings and Links under Styles → Colors → Elements if you want them different.