Cursor Effects

Custom cursor replacement effects for Beaver Builder rows. Four types from smooth dot follower to text label to icon to mix-blend invert circle.

5
Types
0
Dependencies
CSS/JS
Animation
01 of 04Dot
pa_ce_type = dotpa_ce_dot_size = 50pa_ce_dot_color = D0DF2Cpa_ce_hover_scale = 1.5

Dot Cursor

02 of 04Text
pa_ce_type = textpa_ce_text_content = Hello!pa_ce_text_color = ffffffpa_ce_hover_scale = 1.2

Text Cursor

03 of 04Icon
pa_ce_type = iconpa_ce_icon = fas fa-hand-pointerpa_ce_icon_color = D0DF2Cpa_ce_hover_scale = 1.3

Icon Cursor

04 of 04Invert
pa_ce_type = invertpa_ce_invert_size = 50pa_ce_hover_scale = 1.5

Invert Cursor

01
Dot
Smooth filled dot that follows the cursor with spring physics. Scales on hover.
pa_ce_typedot
pa_ce_dot_colorD0DF2C
bg_typecolor
full_heightfull
02
Text
Custom text label that follows the cursor. Great for CTAs and interactive sections.
pa_ce_typetext
pa_ce_text_contentHello!
bg_typecolor
full_heightfull
03
Icon
Custom icon that follows the cursor. Uses any Font Awesome or BB icon.
pa_ce_typeicon
pa_ce_iconfas fa-hand-pointer
bg_typecolor
full_heightfull
04
Invert
Mix-blend-difference circle that inverts colors beneath it. Works on any background.
pa_ce_typeinvert
bg_typecolor
full_heightfull

All Available Options

Cursor Type
DotTextIconInvertImage
Dot Fill
FilledOutline
Controls
Cursor SizeCursor ColorLerp SpeedHover ScaleHover ColorText LabelIconImage