Skip to content

How to Create Text Stroke Outline in WordPress?

Updated On : September 27, 2026By : Reading Time : 1 minute

Key Takeaways

  • Advanced Typography block in Nexter Blocks Pro adds a stroke outline to any text, and the post says Text stroke needs Nexter Blocks Pro.
  • Stroke/Fill settings use Stroke Width, Stroke Color or Gradient Stroke, and a transparent Fill Color to create an outline look.
  • Hover tab Fill Color fills the letters on hover, while thin fonts can look faint with a transparent fill and the post recommends a heavier font weight.
Table of Contents

Outlined text looks light and modern on hero sections, and it can fill with colour when visitors hover.

The Advanced Typography block in Nexter Blocks Pro adds a stroke outline to any text.

For every Advanced Typography setting in one place, see the Advanced Typography block guide.

LIVE BLOCK LINK

Before You Start

  • Edition: Pro — Text stroke needs Nexter Blocks Pro.
  • Block to enable: Advanced Typography, switched on under Nexter > Blocks in your WordPress dashboard.

Steps

  1. Add the Advanced Typography block, keep Normal and type your text in Content. Bold, large fonts work best.
  1. On the Style tab, open Stroke/Fill and turn on Stroke/Fill.
The Stroke/Fill panel turned on with Stroke Width and colours
  1. Set Stroke Width, a Stroke Color (or Gradient Stroke) and a transparent Fill Color for an outline look.
  1. On the Hover tab, set a Fill Color to fill the letters on hover. Save.
Published outlined text created with Stroke/Fill

How It Behaves

  • The letters show only their outline in the Stroke Color.
  • With a hover Fill Color, the outline fills with that colour while the pointer is over the text.

Limitations

  • The Stroke/Fill panel is for Normal text. With Multiple, use Stroke/Fill Options inside each text item.
  • Thin fonts can look faint with a transparent fill. Use a heavier font weight.

Troubleshooting

The text looks unchanged

Set a Stroke Width above 0 and a transparent Fill Color.

Related Docs

Share your Thoughts

Still in Doubt? Let’s Assist You

Raise a ticket Now

Have Feedback or Questions?

Join our WordPress Community on Facebook!

Join Us

Related Frequently Asked Questions

What do I need before creating outlined text in WordPress?

Outlined text in Nexter Blocks Pro needs the Advanced Typography block enabled under Nexter > Blocks in your WordPress dashboard. The page also says this is a Pro-only feature, so the stroke outline is tied to the Pro edition. That matters because the effect depends on the block being available first, not just on typing text into any editor.

How do I make text stroke outline look good on a hero section?

Bold, large fonts work best for this effect because thin fonts can look faint when the fill is transparent. Nexter Blocks Pro creates a light, modern outlined look that fits hero sections well, and the outline can later fill with colour on hover. For cleaner results, keep the text in Normal mode and use a heavier font weight if the letters feel too weak.

Why does my outlined text look unchanged?

The usual cause is that Stroke Width is still at 0 or the Fill Color is not transparent. The outline only becomes visible when you give it a width and remove the solid fill behind it. In Nexter Blocks Pro, that combination is what turns plain text into a stroke outline instead of leaving it looking normal.

Can I use stroke outline on multiple text items separately?

Multiple text items need their own Stroke/Fill Options inside each item. The Stroke/Fill panel itself is for Normal text, so if you are styling separate pieces of text in one block, each item has to be handled individually. That separation matters when you want different outlines or hover fills on different words.

What happens when I add a hover fill color to outlined text?

The letters stay outlined in the Stroke Color until the pointer moves over them, then the Fill Color fills the letters on hover. That gives you a simple interactive effect without changing the base outline style. It works best when the initial fill is transparent, because the hover state becomes much more obvious.

Is there another way to create advanced text effects in Nexter Blocks?

Nexter Blocks has related options for other text treatments too, including Create a text mask effect and Combine multiple styles on a text. The Advanced Typography block guide also collects every setting in one place: Advanced Typography block: all settings. That makes it easier to choose between an outline look and other styling approaches.

Last reviewed: September 27, 2026

Related Docs

How to Add a Before and After Opacity Slider in WordPress?
icon
How to Add a Blend Cursor in WordPress?
icon
How to Add a Blockquote in WordPress?
icon
How to Add a Button in a WordPress Message Box?
icon
How to Add a Button in WordPress Timeline?
icon
How to Add a Call to Action Banner in WordPress?
icon
123………………………………………………………………53