I built 79+ animated React components with Motion and Tailwind v4 (free, MIT, shadcn-style)

Описание и применение

Разработчики могут быстро интегрировать 79+ анимированных компонентов, 18 блоков, 4 фона и 16 хуков в свои проекты, ускоряя разработку UI.

Задача

Frontend developers need reusable, animated UI components that can be customized without waiting for package updates.

Результат

Developers can quickly integrate 79+ animated components, 18 blocks, 4 backgrounds, and 16 hooks into their projects, enabling fast UI development and customization.

Рабочий процесс

• 1. Create a Next.js project with React 19, Tailwind CSS v4, Motion, Radix, and TypeScript.
• 2. Install a component via shadcn CLI: npx shadcn@latest add <registry url> or copy source into the project.
• 3. Import and use the component in JSX, customizing props or overriding styles as needed.
• 4. Run the app; animations work immediately without waiting for package updates.

Доказательства

I built 79+ animated React components with Motion and Tailwind v4 (free, MIT, shadcn-style)

Источник

You install a component like this: npx shadcn@latest add <registry url>

Источник

The code lives in your repo. You can change anything, there's no runtime dependency, and you never wait for me to merge a PR to fix your animation timing.

Источник