A working library of cursor effects, button feedback, text motion and scroll moments in plain React and CSS. Copy the free ones as they are, or unlock the Pro set with one payment.
I see you
116 animated React components, each one working.
Every tile is live: hover, click and drag them. Free ones come with their code, Pro ones unlock with one payment.
- CursorPro
Context label cursor
A small cursor dot swells into a circle with a word, like View, Drag or Play, that names what the hovered item does.
- CursorFree
Crosshair cursor
Thin full width and full height lines track the pointer with a live coordinate readout, and thicken when they lock onto a target.
- CursorFree
Direction aware hover
Each tile's overlay slides in from the edge the pointer entered through and leaves toward the edge it exits.
- CursorFree
Dot and ring cursor
A small dot sits exactly on the pointer while a larger ring trails behind it and swells over links.
- CursorFree
Eyes that follow
A small character whose pupils watch the pointer anywhere on the page and who blinks every few seconds.
- CursorFree
Following pointer label
Inside a card the cursor becomes a small arrow with a name pill that trails behind it with a soft lag.
- CursorPro
Gooey cursor trail
A chain of circles follows the pointer and melts into one stretchy blob that pools back together when it stops.
- CursorPro
Image trail
Moving the pointer drops small photos along its path that pop in, hold for a beat and then fall away.
- CursorPro
Lens magnifier
A round lens follows the pointer over a busy calendar and shows the area underneath at higher zoom.
- CursorFree
Magnetic button
The button leans toward the pointer when it comes close, and its label leans a little further.
- CursorPro
Paint trail grid
The pointer paints a trail of rounded colour tiles on a grid that shrink and fade; a click drops a patch with confetti.
- CursorPro
Pointer parallax layers
A small layered scene shifts with the pointer, the near hills moving more than the far ones, so it reads as depth.
- CursorFree
Sparkle trail
Small four point stars shed from the pointer, spin and drift down as they fade.
- CursorFree
Spotlight cards
A soft light follows the pointer across a row of cards, and each card border glows where the light is closest.
- CursorPro
Tilt and glare card
A card tilts in 3D toward the pointer while a soft glare slides across its face, then eases back flat on leave.
Install it in your coding agent.
The 77 free components ship as one agent skill, with the code, when to use each one and its accessibility notes. One command adds it to Claude Code, Codex, Cursor, Gemini CLI, GitHub Copilot, Windsurf, OpenCode and other agents that read skills.
npx skills add https://swishui.dev --skill swish-uiWant just one? Every component page has its own install command in the SKILL.md tab.
One price for everything in Pro
The free components stay free. Pro unlocks the source of every Pro component.
- Pay once
Lifetime
Pay once, keep it forever.
$39once
- Every Pro component, with full source
- Lifetime updates: every future Pro component included
- One zip download, ready to drop into a React app
- Commercial use in unlimited client and personal projects
Questions
What is free and what is Pro?
77 components are free, with their source and the agent skill. The other 39 are Pro: anyone can try their live demos, and Pro unlocks their source.
Is Pro a subscription?
No. Pro is one payment of $39 and includes every Pro component added later. The price goes up as the library grows, so buying early costs less.
How do I get the files after paying?
Checkout signs you in and takes you to your account, where you can download every Pro component as a zip or copy one from its page. Sign in again any time with your checkout email.
Can I use Pro in client work?
Yes. Use it in unlimited personal and client projects. You cannot resell or redistribute the source as a kit of your own.
Which stack does it need?
React 18 or newer and CSS modules. It works in Next.js, Vite and Remix. No Tailwind or animation library needed.
Can I get a refund?
Yes, within 14 days of a purchase if Pro is not right for you. Payments, taxes and refunds are handled by Polar, our merchant of record.