Pinned Tweet
Launching Eased. React components where the motion is the point, like a product tour whose tooltip glides from step to step instead of blinking out and back
Most of it is free and MIT. The showpieces are in Pro.
eased.dev/?ref=x-launch
A drum picker that feels native: a flick coasts with 0.998 decay, and the selection band bumps from 0.9 to 1 over 180ms as each row crosses. In Pro.
eased.dev/components/wheel-p…
featured in Tailwind Weekly #237. free motion components for shadcn, agent UI included
Tailwind Weekly #237 🔥
📚 CSS does your tooltip positioning now
📚 JPEG XL vs AVIF for web use-cases
📚 5 CSS fouls Kevin Powell sees way too often
🎁 Resource: @easedui, motion-first components for shadcn
💻 Showcase: Superfocus for planning and time blocking
Dive in 👇
A chat input where the send arrow turns into a stop square while the reply streams, then back. Plugs straight into the AI SDK's useChat.
Free and MIT.
eased.dev/components/compose…
One focus ring for a whole form, not one per element. Tab through and it springs from field to field, matching each corner radius.
In Pro.
eased.dev/components/gliding…
A segmented control where the thumb glides and the labels never change weight, so nothing next to it shifts by a pixel when you switch.
Free and MIT.
eased.dev/components/segment…
Composer, free and MIT: eased.dev/components/compose…
EASED20 takes 20% off Pro for the next 100 people
The anticipate curve dips below zero before it goes up. Like a cat before it jumps.
eased.dev/?ref=x-anticipate
I built an approval card where the diff is the thing you approve. Approve is a hold: the button fills while you press and drains back if you let go. In Pro.
eased.dev/components/approva…
the loader itself is never my problem, it's the moment it swaps out for the real content that always looks janky
Install tabs should feel this smooth. The code slides 6px in the direction you clicked and the block's height springs to fit. Pick bun once and every block on the page remembers.
Free and MIT.
eased.dev/components/code-ta…
The durations and springs every Eased component uses. Give them to your agent.
Durations: 100, 150, 200, 300ms, and 500ms for sheets
Exits are faster than entrances
Springs: snappy (stiffness 520, damping 38), bouncy (400, 26)
eased.dev/docs/motion?ref=x-…
FX rate board. A tick washes its cell once and the digits roll the way the rate moved.
In Pro.
eased.dev/components/fx-rate…
Switching a chart's range should feel this smooth. The line morphs into the new one instead of redrawing, while the gridlines slide to the new scale.
In Pro.
eased.dev/components/line-ch…
