Motion-Primitives is an open-source, MIT-licensed UI kit of animated interface components for engineers and designers working with TypeScript, Tailwind CSS, and motion.
What it is
Motion-Primitives is a component library written in TypeScript and released under the MIT license, offering ready-made animated UI building blocks that are designed to be customized and integrated quickly into existing projects. It is built directly on top of two tools it does not replace but sits alongside: motion (motion.dev) for animation and tailwindcss for styling, so its components inherit the styling conventions and animation primitives teams already use. The project is published with a public homepage at motion-primitives.com and full documentation at motion-primitives.com/docs, and its source is hosted openly on GitHub with 6,440 stars, 267 forks, and 35 open issues.
The concrete problem it addresses is the cost of building polished animated interfaces from scratch: an engineer or designer otherwise has to hand-author motion behaviour and styling for each element, which is slow and inconsistent across a product. Motion-Primitives packages that work as reusable components so the same animation quality can be dropped into a codebase without writing the underlying motion and layout code each time, while still leaving the components open to modification through Tailwind CSS.
Key capabilities
- Provides animated interface components built with
motion (motion.dev) and styled with tailwindcss, so integration follows those two libraries' existing conventions.
- Ships as a TypeScript library, giving typed component APIs inside TypeScript codebases.
- Is explicitly designed for customization, with components intended to be adapted to a project's own design rather than consumed as fixed widgets.
- Is released under the MIT license, with the licence text available in the repository at
/LICENSE.md.
- Is distributed as open source code with a repository containing a contributing guide at
/CONTRIBUTING.md.
- Is documented in full at motion-primitives.com/docs, separate from the README itself.
- Is currently in beta, with new components released regularly and significant updates to the code expected.
Who uses it and how
- Engineers and designers who want motion components to drop into a
tailwindcss-based interface rather than authoring animations element by element.
- Teams already adopting
motion for animation who want a curated set of pre-built components built on the same runtime.
- TypeScript projects that need typed, self-hostable UI source they can fork and edit under an MIT licence.
- Contributors who extend the kit itself, guided by the contributing guide and the beta cadence of new component releases.
Getting started
The README does not list an install command or a Docker image; the documented entry point is the documentation site at motion-primitives.com/docs, which covers how to add the components to a project alongside motion and tailwindcss. The repository itself is browsable on GitHub, with the licence in /LICENSE.md and contribution instructions in /CONTRIBUTING.md.
How it compares
Motion-Primitives stands alone in this registry: the facts supplied for it name no comparable component or animation libraries to set it against, only the motion and tailwindcss projects it is built upon. Its MIT licence, open source distribution, and self-hostable TypeScript source distinguish its cost and ownership model from anything a reader might otherwise assume.
When to use it — and when not to
Because the project is in beta, a team adopting it should expect new components and significant changes to existing code, and should verify component stability against its own release cycle before depending on it broadly; with 35 open issues open at the time of listing, gaps and rough edges are plausible. It is a poor fit for anyone who cannot use motion and tailwindcss, or who needs a settled, long-term-stable component set today, and the README itself is deliberately thin — pointing to external documentation rather than describing installation, dependencies, or support in detail, so a self-hoster gets little guidance from the front page alone.