---
title: "How to Create Text Stroke Outline in Elementor?"
url: https://theplusaddons.com/docs/create-text-stroke-outline-in-elementor/
date: 2024-05-15
modified: 2026-09-13
lang: en
author: "Aditya Sharma"
description: "Want hollow, outlined headline text that fills with color on hover? The Stroke/Fill Options of the Advanced Typography widget from The Plus Addons for Elementor draw an outline around the..."
image: https://theplusaddons.com/wp-content/uploads/2024/05/How-to-Create-Text-Stroke-Outline-in-Elementor_-1024x536.jpg
word_count: 273
---

# How to Create Text Stroke Outline in Elementor?

## 

- Advanced Typography from The Plus Addons for Elementor Pro adds Stroke/Fill Options that draw an outline around letters, with separate stroke and fill colors for Normal and Hover.
- Enable/Disable in Content > Stroke/Fill Options turns text outlined right away, and Style > Stroke/Fill Style appears only while Stroke/Fill Options is on.
- Multiple mode gives each item its own Stroke/Fill Options, so it outlines a single word, while the default outline is 2 px dark gray (#313131) with transparent letters.

Want hollow, outlined headline text that fills with color on hover?

The **Stroke/Fill Options** of the Advanced Typography widget from The Plus Addons for Elementor draw an outline around the letters, with separate stroke and fill colors for normal and hover.

*To check the complete feature overview documentation of The Plus Addons for Elementor Advanced Typography widget, [click here](https://theplusaddons.com/docs/advanced-typography/).*

***Requirement - This widget is a part of The Plus Addons for Elementor, make sure it's installed & activated to enjoy all its powers.***

[LIVE WIDGET LINK](https://theplusaddons.com/elementor-widget/advanced-typography/?utm_source=tpae&utm_medium=docs&utm_campaign=text)

## Before You Start

- **Edition:** **Pro** — The Advanced Typography widget needs The Plus Addons for Elementor Pro. In the free plugin it shows in the Elementor panel with a lock icon.- **Widget to enable:** Advanced Typography, switched on under **The Plus Addons > Widgets**.

## Steps

- Add the Advanced Typography widget, keep **Select Option** on **Normal** and type your text.- Open **Content > Stroke/Fill Options** and turn on **Enable/Disable**. The text becomes outlined right away.

![The Stroke/Fill Options section switched on, with outlined text on the canvas](https://theplusaddons.com/wp-content/uploads/2026/09/advtypo-stroke.webp)

![Switching on Stroke/Fill Options in the Advanced Typography widget](https://theplusaddons.com/wp-content/uploads/2024/05/advanced-typography-stroke-fill-option-enable.gif)

- Go to **Style > Stroke/Fill Style** and set the **Stroke Width**.- On the **Normal** tab, set the **Stroke Color** (Classic or Gradient) and, if you want, a **Fill Color**.- On the **Hover** tab, set a **Fill Color** to fill the letters when the mouse is over them.

![Style, Stroke/Fill Style with Stroke Width and the Normal tab colors](https://theplusaddons.com/wp-content/uploads/2026/09/advtypo-stroke-style.webp)

![Adjusting the Stroke/Fill Style settings](https://theplusaddons.com/wp-content/uploads/2024/05/advanced-typography-stroke-fill-style.gif)

## How It Behaves

- With no styling, the outline is 2 px dark gray (#313131) and the letters are transparent.- **Style > Stroke/Fill Style** appears only while Stroke/Fill Options is on.- A hover **Fill Color** turns the outline into solid text on hover.- In **Multiple** mode, each item has its own Stroke/Fill Options, so you can outline a single word.

![Large outlined text with a purple stroke and transparent letters](https://theplusaddons.com/wp-content/uploads/2026/09/advtypo-result-stroke.webp)

![Demo of outline text filling with color on hover](https://theplusaddons.com/wp-content/uploads/2024/05/advanced-typography-stroke-fill-option-demo.gif)

## Related Docs

- [Advanced Typography widget: settings overview](https://theplusaddons.com/docs/advanced-typography/)- [Combine multiple styles on a text](https://theplusaddons.com/docs/multiple-styles-on-a-text-in-elementor/)- [Add vertical text](https://theplusaddons.com/docs/add-vertical-text-in-elementor/)