Cursor Hover

The Cursor Hover Effect Extension enables smooth, real-time animations that respond to mouse movement. It can be applied to any element, including buttons, images, and containers, enhancing the interactivity and modern feel of your site.

Effect

Read Docs

Premium Purchase

Use Cases for Cursor Hover Effect

Call to action Button

Hero Section Highlight

Product Images

Pricing Tables & Plan Cards

Testimonial Cards & Client Photos

Cursor Hover Effect - Demo 01

SEO marketing

Unique SEO strategy approach

SEO marketing

Market research with investment

Modelling - 2012

Siyantika Glory

Social marketing

Social connectivity and community

Cursor Hover Effect - Demo 02

tv/show | 30+ models

Modelling | 45+ models

anchor | 06+ models

Branding | 99+ models

Cursor Hover Effect - Demo 03

Modelling - 2012

Siyantika
Glory

Modelling - 2012

Siyantika
Glory

Modelling - 2012

Siyantika
Glory

Modelling - 2012

Siyantika
Glory

Have question? we’re here to help

Documentation & Inspiration

View Documentation

Become a part of our community

Join Community

Didn’t find Your Answer?

What is the Cursor Hover Effect Extension used for?

The Cursor Hover Effect Extension enables users to add interactive hover animations to any element within Elementor. When a user moves the cursor over an element, styled text appears dynamically with customizable colors, borders, and design effects. This enhances the website’s responsiveness and visual engagement.

Can the animation be previewed while editing in Elementor?

Yes. To preview the animation directly within the Elementor editor, set the “Enable On Editor” option to “Yes.” When this option is turned off, the animation will remain active on the live website but will not display in the editor during design time.

Are font styles customizable for the hover text?

Absolutely. The extension provides comprehensive typography controls. It allows customization of the font family, size, weight, text transform, style, decoration, line height, letter spacing, and word spacing. All of these options can be configured directly within the widget’s settings.

Can background gradients and borders be applied to the hover effect?

Yes. A full range of visual styling options is available. Background colors and gradient angles can be customized. Various border styles, such as solid, double, dotted, dashed, and groove, are supported. Additionally, the border width and radius can be adjusted to achieve the desired design.