Need Help?

Here are some good places you cant start.

Whats New?

Get updated about all the good stuff!

Content Carousel - Featured Blog
Stacked Images - Featured Blog
ACF Repeater Field - Featured Blog

Custom Cursor for Elementor

The Custom Cursor widget for Elementor enhances the website’s interactivity by providing a distinctive and personalized cursor experience. With this widget, you can easily customize cursor styles to match your brand, creating dynamic and engaging effects that captivate your audience. Whether you’re aiming for subtle animations or bold visual cues, the Custom Cursor Widget offers the flexibility to elevate your user experience.

Let’s look at each of the options in the Custom Cursor widget for Elementor below.

Elementor Custom Cursor Video Tutorial

Add Custom Cursor Widget to Elementor

This widget requires Unlimited Elements PRO version installed and activated on your WordPress website.

  1. Go to Unlimited Elements Widget Library
  2. Search in the search bar for “Custom Cursor”
  3. Hover over the widget in the search results and click install
  4. Add your “Custom Cursor” widget to any Elementor Page 

General Settings

1

Cursor Type

Select the cursor type from below options-

  1. Trail
  2. Custom Cursor
  3. Shine
2

Disable on Touch Devices

Cursor effect will be disabled on touch devices.

Cursor Trail Settings

1

Apply Cursor Trail to

Choose where to apply the cursor trail effect:

  1. Page - It applies the cursor effect to entire page.
  2. Section ID or Class- - It applies the effect to the sections or elements specified by their CSS ID or class.
2

Pause Animation

Turn on or off the pause animation option.

3

Color Difference

Choose this option to turn on the color difference option on cursor.

4

Default Cursor

Show or hide the default cursor.

Custom Cursor Settings

1

Apply Cursor Trail to

Choose where to apply the cursor trail effect:

  1. Page - It applies the cursor effect to entire page.
  2. Section ID or Class- It applies the effect to the sections or elements specified by their CSS ID or class.
2

Show Default Cursor

Show or hide the default cursor.

3

Show Outer Cursor

It will add another layer of circle on cursor.

4

Graphic Element

You can show an graphic element in cursor such as Icon, SVG, Image, Text.

5

Pointer Event Position

Set the position of the pointer activation area of inner cursor.

  1. Top
  2. Center
6

Inner Cursor Delay

Set the inner cursor delay to create a parallax effect on cursor.

7

Outer Cursor Delay

Set the outer cursor delay to create a parallax effect on cursor.

8

Hide cursor if not moving

It will hide the cursor if user is not moving the cursor.

9

Enable Attention Grabber

Enable any of the following attention grabber effect on cursor.

  1. Blink
  2. Bounce
  3. Fade
  4. Shine
  5. Spin
  6. Pulse 
  7. Grow
  8. Waggle

Shine Cursor Settings

1

Apply Cursor Trail to

Choose where to apply the cursor trail effect:

  1. Page - It applies the cursor effect to entire page.
  2. Section ID or Class- It applies the effect to the sections or elements specified by their CSS ID or class.
2

Frequency

Set the frequency of shine effect.

3

Delay

Set the duration of shine effect.

4

Shine Style

Select the shine style from given options.

5

Shine Color

Select the shine color from different color options.

6

Shine Scale

Set the shine scale.

7

Shine End Scale

Set the scale of shine on the end of animation.

Custom Cursor Widget Styling

You can set the cursor size, color, border radius, border, box shadow etc.

Custom Cursor Widget Design Examples For Elementor

Here are some live use cases for the Custom Cursor widget.

Custom cursor with custom created circular effects.

Custom cursor with trail effect.

Thank you for exploring the Custom Cursor Widget for Elementor. We hope this documentation has equipped you with the knowledge to effectively implement and customize the cursor design. By integrating this widget, you can elevate your website’s user experience and create a more engaging environment for your visitors. For further information and support, please feel free to reach out to support team.

Download is just a click away

Get instant access to tons of Elementor goodies, completely FREE!

Hurray!

You got FREE access to the worlds leading widgets for Elementor page builder!