Cursor Effect
<body data-plugin-cursor-effect data-plugin-options="{'hideMouseCursor': true}">
<body data-plugin-cursor-effect data-plugin-options="{'cursorOuterColor': '#10b130', 'cursorInnerColor': '#10b130'}">
Block
Block
Block
The attribute data-cursor-effect-hover should be added to element that will be hovered. Example of usage:
<!-- Fit Effect --> <a class="btn btn-primary btn-modern btn-px-3 btn-py-2" data-cursor-effect-hover="fit">HOVER ME</a> <!-- Plus Effect + Default Color --> <a class="btn btn-light btn-modern btn-px-3 btn-py-2" data-cursor-effect-hover="plus">HOVER ME</a> <!-- Plus Effect + Dark Color --> <a class="btn btn-primary btn-modern btn-px-3 btn-py-2" data-cursor-effect-hover="plus" data-cursor-effect-hover-color="dark">HOVER ME</a> <!-- Plus Effect + Light Color --> <a class="btn btn-primary btn-modern btn-px-3 btn-py-2" data-cursor-effect-hover="plus" data-cursor-effect-hover-color="light">HOVER ME</a> <!-- Input + Fit Effect --> <input type="text" class="form-control" value="" placeholder="Name" data-cursor-effect-hover="fit" /> <!-- Custom Block + Fit Effect --> <div class="d-flex align-items-center justify-content-center bg-color-light-scale-1 py-5" data-cursor-effect-hover="fit"> Block </div>