Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

For a single section, select its block in the WordPress editor, open the Settings sidebar, and use the block’s Typography or Color control. Choose a palette color or enter a custom value. For a site-wide default on a block theme, use Appearance > Editor > Styles > Colors > Text. If those controls are unavailable, the selected block, theme, editor, or your permissions may not support them; scoped CSS is the fallback.

Change the text color in one block

  1. Open the post, page, template, or pattern in the block editor.
  2. Select the text block you want to edit.
  3. Open the Settings sidebar with the settings icon near the Publish or Save button if it is hidden.
  4. Expand Typography or Color, then open the text-color control. WordPress documentation describes this as clicking the Color button to change all text in a block: Typography Settings overview.
  5. Choose a theme or default palette color, or open the custom-color picker and enter a value such as a HEX code.
  6. Check the text on its real background, preview the page, and select Save or Update.

The setting normally applies to the text in the selected block. Controls differ between blocks and themes, so a paragraph, heading, button, group, or other block may expose different options. A single word or phrase may not have a separate inline color control in your editor; use the controls that the selected block actually provides.

Set the default text color across the site

This route changes the default for site content rather than one isolated block and requires a block theme with the Site Editor (the Styles feature is documented for WordPress 5.9 and later).

  1. Go to Appearance > Editor.
  2. Open Styles, then Colors.
  3. Choose the Text element and select a palette color or enter a custom HEX, RGB, or HSL value.
  4. Review representative posts, pages, templates, links, headings, buttons, and colored sections before saving.

Do not choose Links, Headings, Buttons, or Background unless that is the element you intend to change. The Styles overview and Site Editor documentation explain the block-theme workflow.

What’s actually slowing this PC down?

Pick the symptom - the matching free tool is one click away.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Use a custom color value

Block color controls accept a custom value in addition to the available palette. Global Styles can define palette colors with HEX, RGB, or HSL values. Prefer a theme palette when possible so repeated content stays consistent; use a custom value when the design requires a specific color.

Choose the right method

Method Scope Prerequisite Best use
Block Typography/Color setting Selected block The block exposes text-color controls Changing one content section without affecting the rest of the site
Site Editor: Styles > Colors > Text Site-wide default text Block theme and Site Editor Establishing a consistent default across pages and templates
Additional CSS Whatever the selector targets Correct selector and the required CSS capability Targeted or advanced styling beyond visible controls
Classic visual editor controls Content maintained in the Classic interface Classic editor or Classic block Older content that is not being edited with ordinary block settings

When the color control is missing

  • Check the selected block: not every block supports text color, and themes can limit or customize available colors. The Block Editor Handbook documents block support and theme presets.
  • Identify the editor: a Classic block uses the classic visual-editor toolbar rather than the usual block-settings sidebar. See the Classic block documentation.
  • Check the theme: Appearance > Editor > Styles is a block-theme workflow, so a classic theme may not show it.
  • Check permissions: the Additional CSS field requires the edit_css capability according to WordPress’s Advanced Settings overview.
  • Check for conflicting styles: a theme, template, plugin, or more-specific rule may override the color you selected. Preview the affected page and inspect the intended scope before changing anything globally.
Independent reader supportYour contribution helps us test, update, and keep practical guides available for everyone.Support on Ko-Fi

Apply text color with Additional CSS

CSS is appropriate when you can identify the exact element or class and need styling that the block controls do not provide. In a supported Additional CSS field, a declaration can be as simple as:

.your-class {
  color: #2457a6;
}

Replace .your-class with a selector that matches your site’s markup. There is no universal selector that is safe for every WordPress site: a broad rule such as p { color: ...; } can unintentionally recolor templates, widgets, or forms. Apply the narrowest selector that meets the requirement, preview it, and save only after checking posts, pages, and responsive layouts. Some supported blocks also provide an Additional CSS field in their settings; availability depends on the block, theme, WordPress version, and permissions.

Keep the new color readable and accessible

  • Check the chosen text against its actual background, not just the editor canvas. The block editor may warn when a combination is difficult to read; WordPress documents this behavior in its Colors Settings overview.
  • For plain content text, the WordPress Theme Handbook cites the WCAG 2.0 AA requirement of a 4.5:1 contrast ratio. See Theme Handbook: Accessibility.
  • Do not use color as the only way to identify links, errors, or other important information. Add an additional cue such as underlining, an icon, text, or a visible border.
  • Review the change on mobile and on sections with alternate backgrounds. Responsive style behavior and contrast checking are discussed in Responsive styles.

Which approach should you use?

  • Choose the block’s Typography/Color control for a one-off change.
  • Choose Styles > Colors > Text when you intentionally want a new default throughout a block-theme site.
  • Choose Additional CSS only when you need a precise selector or a control your block and theme do not expose.
  • Use the Classic editor’s toolbar for content that remains in a Classic block.

Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.