Cursor & Micro-interactions

The classic: 150+ animated components and effects, Tailwind + Motion.

• magic-card — spotlight that follows the cursor
• aurora-text — aurora gradient text
• warp-background — time-warping card background
• smooth-cursor — spring physics cursor

bunx shadcn add @magicui/<item>

Unique, interactive components that can make your site feel 10x more alive.

• hero effects
• 3D cards
• parallax comps

bunx shadcn add @aceternity/<item>

Beautifully designed motion components. Easy copy-paste, open source.

• text reveals
• expandable cards
• sliders

bunx shadcn add @motion-primitives/<item>

Fully animated distribution of primitives, components and icons.

• animated primitives
• icons
• blocks

bunx shadcn add @animate-ui/<item>

Motion-first primitives with cinematic scroll work via GSAP ScrollTrigger.

• cursor-trail-reveal — cursor reveals image strips via clip-path wipes
• scroll-gallery — sticky scroll slider w/ strip-mask transitions

bunx shadcn add @soralabs/<item>

One perfect component: echo-text, layered stroke text trailing the pointer.

• pointer-following motion trail

bunx shadcn add @text-ui/<item>

Figma-like scrub number field: drag-to-scrub digits with animation.

• scrub-number-field

bunx shadcn add @kinetic/<item>

Proximity hover, merge/split selection, spring everything — functional clarity.

• use-fluid-hover — nearest-item hover physics
• merge/split selection backgrounds

bunx shadcn add @fluid/<item>

GSAP-crafted interactions: liquid cursor, squash text, scroll staggers.

• liquid-cursor — cursor with stretch and fluidity
• draw-line-text — stroke-drawn type
• mouse-wave-text — wave bounce under the mouse

bunx shadcn add @paceui-gsap/<item>