A chromatic aberration logo effect on hover built with modern frontend techniques for responsive and reusable UI.
Cursors
22 snippetsWelcome to the Cursors resource page — a curated directory for developers. Browse practical UI patterns, specialized libraries, and small interactive demos. Use the table of contents to explore subcategories below.
javascript-cursors
Snippets(22)
- Chromatic Aberration Logo Effect on Hover
- Direction-Aware SVG Cursor
A direction-aware svg cursor built with modern frontend techniques for responsive and reusable UI.
- Dynamic Custom Cursor with GSAP
A dynamic custom cursor with gsap built with modern frontend techniques for responsive and reusable UI.
- Ghost Cursor Effect
A ghost cursor effect built with modern frontend techniques for responsive and reusable UI.
- Hero Section with Cursor Trail Effects
A hero section with cursor trail effects built with modern frontend techniques for responsive and reusable UI.
- Navigation Button Interaction
A navigation button interaction built with modern frontend techniques for responsive and reusable UI.
- Next-Gen Tic-Tac-Toe Game (Shiny Edges)
A next-gen tic-tac-toe game (shiny edges) built with modern frontend techniques for responsive and reusable UI.
- Selected Demos 2019-2020
A selected demos 2019-2020 built with modern frontend techniques for responsive and reusable UI.
- Sticky Stretching Cursor
A sticky stretching cursor built with modern frontend techniques for responsive and reusable UI.
- Three.js Glowing Noise Cursor Effects
A three.js glowing noise cursor effects built with modern frontend techniques for responsive and reusable UI.
- Yet Another Slider
A yet another slider built with modern frontend techniques for responsive and reusable UI.
- Cinematic Masked Video Hero
A cinematic masked video hero built with modern frontend techniques for responsive and reusable UI.
Technologies
HTML, CSS, JavaScriptDifficulty
AdvancedBrowser support
Chrome 90+, Edge 90+, Firefox 89+, Safari 15+Features
SVG Masking, Layered Text, Custom Cursor, Intro Loader - Cinematic Context-Aware Video Cursor
A cinematic context-aware video cursor built with modern frontend techniques for responsive and reusable UI.
Technologies
HTML, CSS, BabelDifficulty
IntermediateBrowser support
Chrome 105+, Edge 105+, Firefox 121+, Safari 15.4+Features
Context Awareness, Pointer Tracking, Logic-less CSS State - Hover Image Reveal Custom Cursor
A hover image reveal custom cursor built with modern frontend techniques for responsive and reusable UI.
Technologies
HTML, CSS, JavaScriptDifficulty
IntermediateBrowser support
Chrome 49+, Edge 16+, Firefox 54+, Safari 10.1+Features
Custom Cursor, Image Reveal, State Delegation, Blend Modes - Slider #2
A slider #2 built with modern frontend techniques for responsive and reusable UI.
- Simple Full-Screen Slideshow With Vanilla JavaScript
A simple full-screen slideshow with vanilla javascript built with modern frontend techniques for responsive and reusable UI.
- Staggered Particle Blob Effect
A staggered particle blob effect built with modern frontend techniques for responsive and reusable UI.
Technologies
HTML, CSS, JavaScriptDifficulty
AdvancedBrowser support
Chrome 79+, Edge 79+, Firefox 71+, Safari 13+Features
Cursor Tracking, Staggered Animation, Auto-simulation, Blend Modes - Dynamic Article Hover Cursor
A dynamic article hover cursor built with modern frontend techniques for responsive and reusable UI.
Technologies
HTML, CSS, BabelDifficulty
IntermediateBrowser support
Chrome 105+, Edge 105+, Firefox 121+, Safari 15.4+Features
Custom Cursor, CSS :has(), Blend Modes, Grid LayoutResponsive
Yes - Spotlight Cursor on Responsive Image
A spotlight cursor on responsive image built with modern frontend techniques for responsive and reusable UI.
Technologies
JavaScript, CSS3Difficulty
IntermediateFeatures
Custom Cursor, Color Inversion, Interactive GradientResponsive
Yes - Smart Animated Custom Mouse Cursor
A smart animated custom mouse cursor built with modern frontend techniques for responsive and reusable UI.
Technologies
Web Animations API, CSS Transform, JavaScriptDifficulty
intermediateFeatures
Custom Cursor, Dynamic Scaling, Interactive Hover EffectsResponsive
Yes - Web Animations, Sound, and Custom Cursor Mix
A web animations, sound, and custom cursor mix built with modern frontend techniques for responsive and reusable UI.
Technologies
Web Animations API, Web Audio API, JavaScriptDifficulty
AdvancedFeatures
Custom Cursor, Kinetic Animation, Audio Feedback, Mouse TrackingResponsive
Yes - Adaptive Morphing Mouse Cursor Trailer
A adaptive morphing mouse cursor trailer built with modern frontend techniques for responsive and reusable UI.
Technologies
HTML, CSS, JavaScriptDifficulty
IntermediateBrowser support
Chrome 36+, Edge 12+, Firefox 48+, Safari 9+Features
Contextual Scaling, Icon Swapping, Elastic TrackingResponsive
Yes

















