---
title: "How to Add  Elementor Background Text Blend Mode?"
url: https://theplusaddons.com/docs/add-elementor-background-text-blend-mode/
date: 2024-05-27
modified: 2026-06-29
lang: en
author: "Aditya Sharma"
description: "The Advanced Typography widget in The Plus Addons for Elementor lets you blend text with the background of a section. This creates a striking visual contrast between the text and..."
image: https://theplusaddons.com/wp-content/uploads/2024/05/How-to-Create-Elementor-Text-Blend-Mode_-2-1024x536.jpg
word_count: 310
---

# How to Add  Elementor Background Text Blend Mode?

## 

- Utilizes the Advanced Typography widget from The Plus Addons for Elementor to create text blend effects.
- Enables Background based Blend Mode in the Advanced Typography tab for enhanced visual effects.
- Requires installation and activation of The Plus Addons for Elementor to access the blend mode features.

The Advanced Typography widget in The Plus Addons for Elementor lets you blend text with the background of a section. This creates a striking visual contrast between the text and the background image or color.

With the Advanced Typography widget from The Plus Addons for Elementor, you can create text blend effects against any background in your Elementor sections.

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

**Best Used For:**

- Creative agencies and designers who use text blend modes to add depth and contrast to hero sections

- Portfolio and personal branding sites that want experimental typographic effects against image or color backgrounds

- Event and entertainment websites that use blend mode text to create dramatic visual overlays

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

[LIVE WIDGET LINK](https://theplusaddons.com/elementor-widget/advanced-typography-for-elementor/)

To do this, add the **Advanced Typography** widget to the page and follow the steps below.

1. Add a background color or image to the section containing the Advanced Typography widget.

> *Note: Using a background image will give a better blend mode effect.*

2. In the **Advanced Typography** tab, select **Normal** or **Multiple** from the **Select Option** dropdown.

Select **Normal** for this example.

3. Add the text in the **Text** field.

4. Enable the **Enable/Disable** toggle in the **Background based Blend Mode** tab.

![](https://theplusaddons.com/wp-content/uploads/2024/05/advanced-typography-background-based-blend-mode-enable-1.gif)

> *Note: In the Multiple option you'll find the Background based Blend Mode in each text repeater item.*

5. From the **Variations** dropdown, select a blend mode.

> *Note: The effect will vary based on the section background.*

The text blend effect will now appear on the section. Use other options in the Advanced Typography widget, such as animation and marquee, to create additional effects.

![](https://theplusaddons.com/wp-content/uploads/2024/05/advanced-typography-background-based-blend-mode-demo-1.gif)

***Keep Reading***: [*How to Create a Text Mask Effect in Elementor?*](https://theplusaddons.com/docs//text-mask-effect-in-elementor/)