How to Underline Text in WordPress (Block Editor)

The fastest way to underline text in WordPress is to select the text and press Ctrl + U (Windows) or Cmd + U (Mac). That shortcut still works in the block editor even though the underline button was removed from the toolbar. If you’d rather use HTML, you can wrap the text in a <u> tag using the block’s “Edit as HTML” option.

Below I’ll show both methods, a third option with an inline style if you want more control, and a quick note on why the button is missing in the first place.

Method 1: Keyboard shortcut (fastest)

Select the text you want to underline and press:

• Windows / Linux: Ctrl + U
• Mac: Cmd + U

The text is underlined instantly. The shortcut works inside paragraph blocks, heading blocks, list items, and most other text-based blocks. There’s no visible button for it on the toolbar, which is why most people assume it was removed entirely.

Method 2: Wrap the text in a <u> tag

If the keyboard shortcut isn’t working (some browsers intercept Ctrl + U to view page source), you can add the HTML directly.

1. Click the block you want to edit so the toolbar appears.
2. Click the three-dot menu (⋮) on the toolbar and choose Edit as HTML.
3. Wrap your text in <u>...</u> tags.
4. Click the three-dot menu again and choose Edit visually to switch back.

Here’s what the HTML looks like:

Here is my <u>underlined</u> text.

The <u> tag is valid HTML5 and renders as underlined by default in every browser. It’s the cleanest option when you want markup instead of a style attribute.

Method 3: Use an inline style (more control)

If you need to control the underline color, thickness, or offset (for example, a wavy red underline or a dotted one), use a <span> with an inline style instead of the <u> tag. Same “Edit as HTML” workflow as Method 2.

Here is my <span style="text-decoration: underline;">underlined</span> text.

For extra control, swap in any of the modern text-decoration properties:

<span style="text-decoration: underline wavy red;">heads up</span>
<span style="text-decoration: underline dotted; text-underline-offset: 4px;">note</span>

If you’re going to style underlines the same way across many posts, it’s cleaner to define a CSS class once and reuse it. I walk through the cleanest way to do that in my guide on adding custom CSS to WordPress.

Why doesn’t WordPress have an underline button?

The WordPress design team removed the underline toolbar button on purpose. Underlined text on the web overwhelmingly signals a hyperlink, and making regular text look like a link is an accessibility and usability issue. The shortcut and HTML options still work for the (smaller) set of cases where underline is the right call.

When underlining is genuinely useful:

• Reproducing a scanned document or quoted source where the original used underline
• Marking an annotation or proofing note inside content
• Styled accents where the underline is clearly decorative (colored, offset, or wavy)

When to avoid it:

• Emphasising a word or phrase in a paragraph (use bold or italic instead)
• Drawing attention to a CTA (buttons or bolded copy work better)
• Anywhere it could be mistaken for a link

People also ask

Bottom line

For most cases, the Ctrl/Cmd + U shortcut is all you need. Reach for the <u> tag if the shortcut’s being intercepted by your browser, and the inline style approach when you want a decorative underline with a specific color or style. Just avoid using underline for general emphasis, bold and italic exist for that, and they don’t look like broken links.