About
Motion that feels crafted, not busy.
Hz is a set of GSAP interaction recipes for Next.js. Each one is small enough to read in a minute, tuned until it feels right, and explained so you know why it works. The name is the unit of frequency: smooth motion is a frame rate you never notice.
12 of 24 recipes ready
01
Measured, not busy
Every motion earns its place. Calm is the default.
02
Show the numbers
Ease, duration, progress and frame rate stay visible, like an instrument.
03
The stage is the hero
The interface steps back, like walls in a gallery.
Every recipe follows the same rules
- 01Only gsap and @gsap/react as dependencies.
- 02Under 150 lines for the component.
- 03Set up inside useGSAP, so cleanup is automatic.
- 04Safe for server rendering in the App Router.
- 05A real reduced-motion fallback.
- 06Interruptible where it matters.
- 07Keyboard friendly, with alternatives for pointer-only gestures.
Credits
Built on GSAP, which became free for everyone in 2025. Distributed through the shadcn registry. Type set in Geist. Made by Sounak Pal. The code is MIT licensed and on GitHub.
Read the docs →