Trail Types
Choose different trail shapes that follow your cursor:
CursorLab.setCursorTrail('circle').startTrail();
Custom Cursors
Change the actual cursor appearance:
CursorLab.setCustomCursor('crosshair', 2, 15); // thickness, length
CursorLab.setCustomCursor('grab');
CursorLab.setCustomCursor('url(path/to/cursor.png), auto');
CursorLab.setCustomCursor('grab');
CursorLab.setCustomCursor('url(path/to/cursor.png), auto');
Method Chaining Examples
Combine multiple effects with method chaining:
// Example 1: Red circle with grab cursor
CursorLab.setCursorTrail('circle')
.setColor('#ff0000')
.setSize(15)
.setThickness(3)
.setCustomCursor('grab')
.startTrail();
// Example 2: Fast blue star
CursorLab.setCursorTrail('star')
.setColor('#0066ff')
.trailDelay(0.05)
.setSize(25)
.startTrail();
CursorLab.setCursorTrail('circle')
.setColor('#ff0000')
.setSize(15)
.setThickness(3)
.setCustomCursor('grab')
.startTrail();
// Example 2: Fast blue star
CursorLab.setCursorTrail('star')
.setColor('#0066ff')
.trailDelay(0.05)
.setSize(25)
.startTrail();
Advanced Styling
Use setCustomStyle for advanced CSS control:
// Custom CSS styling
CursorLab.setCustomStyle({
cursor: 'none',
'pointer-events': 'auto'
});
// Or with CSS string
CursorLab.setCustomStyle('* { cursor: crosshair !important; }');
CursorLab.setCustomStyle({
cursor: 'none',
'pointer-events': 'auto'
});
// Or with CSS string
CursorLab.setCustomStyle('* { cursor: crosshair !important; }');
Control Panel
How It Works:
1. Use
2. Customize with
3. Set cursor with
4. Apply custom styles with
5. Start the trail with
6. Chain methods together for powerful combinations!
1. Use
setCursorTrail(type) to choose trail shape2. Customize with
setColor(), setSize(), setThickness(), trailDelay()3. Set cursor with
setCustomCursor()4. Apply custom styles with
setCustomStyle()5. Start the trail with
startTrail()6. Chain methods together for powerful combinations!
Note: Image cursors may not work on all browsers due to CORS policies. Use local images or data URLs for best results.
CLI Help
After installing CursorLab, you can access help directly from the command line:
npm install cursorlab
cursorlab help # Show detailed documentation
cursorlab version # Show version info
cursorlab help # Show detailed documentation
cursorlab version # Show version info
The CLI provides comprehensive examples and usage patterns for all methods!