Animation & Motion Packages
Animation and motion libraries for transitions, gestures, and physics-based UI — the tools behind smooth, native-feeling interface interactions on the web.
Packages in Animation & Motion
dnd-kit
A lightweight, extensible React library for building accessible drag-and-drop interfaces.
tailwindcss-animate
Tailwind CSS plugin for enter and exit animations using utility classes
tw-animate-css
A pure-CSS, Tailwind CSS v4 compatible replacement for tailwindcss-animate.
Motion
A hybrid JavaScript and React animation library built for 120fps gestures, springs, and layout transitions.
Vaul
An unstyled, physics-based drawer component for React, built on Radix UI's Dialog primitive.
Embla Carousel React
A lightweight, dependency-free React hook for building fluid, touch-precise carousels and sliders.
D3.js
The JavaScript library for building custom, data-driven documents with SVG, Canvas, and HTML
canvas-confetti
A zero-dependency JavaScript library for firing performant, physics-based confetti animations on an HTML canvas.
use-stick-to-bottom
Zero-dependency React hook and component that keeps AI chat scrolled to the bottom as content streams in.
react-beautiful-dnd
Beautiful and accessible drag and drop for lists with React
React Native Reanimated
Run smooth, gesture-driven animations directly on the UI thread in React Native.
React Native Gesture Handler
Declarative, native-driven touch and gesture handling for React Native, recognized on the UI thread.
react-transition-group
react-transition-group: React Component Animation Toolkit
NProgress
Minimalist slim progress bar for the top of the page, inspired by YouTube and Medium
NumberFlow (React)
An animated number component for React that transitions digits, formats locales, and respects reduced-motion preferences
