---
title: "How to Add a Blend Cursor in Elementor?"
url: https://theplusaddons.com/docs/add-a-blend-cursor-in-elementor/
date: 2025-01-11
modified: 2026-04-09
lang: en
author: "Aditya Sharma"
description: "Do you want to add a blend cursor in Elementor? A blend circle cursor blends with your content, adding a unique and creative touch to your website. With the Mouse..."
image: https://theplusaddons.com/wp-content/uploads/2025/01/How-to-Add-a-Blend-Cursor-in-Elementor_-1024x536.jpg
word_count: 334
---

# How to Add a Blend Cursor in Elementor?

## 

- Adds a blend cursor using the Mouse Cursor widget from The Plus Addons for Elementor.
- Selects Follow Circle from the Cursor Type dropdown to configure the blend cursor style.
- Utilizes the Mix Blend Mode dropdown in the Style tab to achieve blending effects with content.

Do you want to add a blend cursor in Elementor? A blend circle cursor blends with your content, adding a unique and creative touch to your website.

With the Mouse Cursor widget from The Plus Addons for Elementor, you can easily add a blend cursor in Elementor.

*To check the complete feature overview documentation of The Plus Addons for Elementor Mouse Cursor widget, [click here](https://theplusaddons.com/docs//add-a-custom-cursor-in-elementor/).*

***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/mouse-cursor/)

To do this, add the Mouse Cursor widget from The Plus Addons for Elementor to the page and follow the steps -

1. Select the appropriate cursor area from the **Cursor Area** dropdown.

![](https://theplusaddons.com/wp-content/uploads/2025/01/mouse-cursor-blend-cursor.gif)

2. Then select **Follow Circle** from the **Cursor Type** dropdown.

3. From the Pointer Type dropdown, select **Predefined**. 

4. Then, from the **Select Pointer** dropdown, you have to select a cursor icon.

5. After that, select **Blend Cursor **from the **Follow Circle Style** dropdown.

From the **Circle Max Width** and **Circle Max Height** sections, you can manage the width and height of the circle.

You can manage the circle’s left and top distance from the mouse cursor from the **Cursor Left Offset** and **Cursor Top Offset** sections.

From the **Circle Z-Index** section, you can maintain the z-index of the circle, if the circle doesn’t show over any element.

Then, in the **List of Tags for Hover Effect** section, you can add tags where you want to show the cursor hover effect.

> *Note: You can add multiple tags separated by a comma (,) and you have to add transform CSS for the hover effect in the Style tab.*

6. Then go to the **Style** tab, from the **Mix Blend Mode** dropdown, you have to select a blend mode.

From the Normal and Hover tabs, you can style the cursor circle for normal and hover states.

Based on the selected blend mode, you’ll see the circle cursor blending with your content.

![](https://theplusaddons.com/wp-content/uploads/2025/01/mouse-cursor-blend-cursor-demo.gif)