Beautifully designed motion components. Easy copy-paste. Customizable. Open Source. Built for engineers and designers.

Motion-Primitives is a project dedicated to showcasing animated components built with Framer Motion and Tailwind CSS. This repository offers a curated collection of reusable components designed to enhance your web applications or marketing websites with beautiful, smooth animations.

The project is currently in beta. The code and styles of the components are subject to change as we continue to refine and improve the collection. We welcome your feedback and contributions to help make this project better.


As a developer keen on growing my skills in animation and motion design, I often found it challenging to find practical, high-quality code examples of animated components that were not just theoretical but also applicable to real-world projects. This gap inspired me to create Motion-Primitives.

Ready-to-use components

All components are fully documented with examples, ready for implementation and customization across various projects.

Community contribution

With an open-source approach, Motion-Primitives strives to build a diverse, free and open collection of animated components.

Style flexibility

Starting with styled versions during the beta phase, with plans to offer unstyled alternatives that can easily integrate into any existing design system or theme.


Ensuring that all components meet high accessibility standards, making them usable for everyone. We are thinking about using radix-ui or shadcn/ui for each component.