Cursor trails are one of those small details that quietly make a site feel more crafted. Liquid Cursor adds one that actually looks good — a smooth ribbon that flows behind the cursor, tapers as it fades, and curves naturally instead of drawing jagged straight lines between mouse positions.
The motion is interpolated, so even fast cursor jerks come out as smooth arcs. The trail tapers from thick at the cursor to thin at the tail, then fades out. Three color modes cover most use cases: a solid color for restraint, a gradient for something more branded, or rainbow if your site has the personality for it.
What's inside:
Smooth ribbon trail that follows the cursor with quadratic curves
Three color modes: Solid, Gradient (multi-stop), and Rainbow (cycles hues)
Adjustable initial width, trail duration, and motion smoothing
Full-screen mode that overlays your entire site, or contained mode for specific sections
Touch support, so the trail follows finger drags on mobile too
Canvas-based rendering, runs at 60fps without slowing the page down
Where it fits:
Portfolios, agency sites, design studios, creative landing pages, product sites that lean playful — anywhere a little motion adds character without distracting from the content.
Setup:
Drop the component anywhere on your canvas. For full-screen mode, leave "Full Screen" on and the trail will overlay your entire site automatically. For contained mode, turn it off and place the component inside the section where you want the trail to appear. Pick your color mode and tweak the width and duration to taste.
Pro tip: Keep the trail duration short (0.2–0.5s) on content-heavy sites so the trail enhances the cursor without competing with what people are reading. Save the longer, more theatrical trails for hero sections and minimal landing pages where the motion is part of the design.
Note: Framer's canvas preview can make the trail look choppier than it actually is. Always check the live preview or published site for the real motion.
Refund Policy: All sales are final. We do not offer refunds, exchanges, or returns on Framer components. For technical support or questions about implementation, contact us at syedsaboor005@gmail.com
Syed Saboor
