A Motion Primitives alternative for React motion components

beUI vs Motion Primitives

What is Motion Primitives good at?

Motion Primitives describes itself as a UI kit to make beautiful, animated interfaces faster: easy copy-paste, customizable and open source. Its docs group components into core components (accordion, animated background, carousel, dialog, disclosure, infinite slider), text effects (text effect, loop, morph, roll, scramble, shimmer), number effects, interactive elements such as dock, tilt and spotlight, toolbars, and advanced effects like morphing dialog, morphing popover and progressive blur.

Each component has examples and documentation, and installs through its own CLI, the shadcn registry, or by hand. A Pro offering adds premium sections and templates.

Where does beUI differ from Motion Primitives?

The philosophy is close: small, composable motion pieces built on Framer Motion and Tailwind CSS that you copy and own. beUI pushes that approach into a larger surface of product UI. Its 107 web components include form and selection controls (select, combobox, multi select, checkbox, radio, sliders, wheel picker, OTP input), overlays (tooltip, popover, context menu, drawer, bottom sheet), Charts and an AI Agents category.

Larger beUI components support controlled and uncontrolled state, overlays manage focus and keyboard input, and transform-based motion is gated behind useReducedMotion. Shared tokens in lib/ease.ts keep springs and easing consistent from one component to the next.

How do I install a beUI component?

beUI uses the shadcn CLI directly and is listed in its official registry directory as @beui. This example adds the text shimmer, a gradient sweep for loading or emphasis. You can add several components in one go.

# once per project, if components.json does not exist yet
npx shadcn@latest init

npx shadcn@latest add @beui/text-shimmer
npx shadcn@latest add @beui/dock

Can I use Motion Primitives and beUI together?

Yes. Both depend on Framer Motion and Tailwind CSS and both write source into your project, so there is no runtime conflict and only one copy of Framer Motion is needed. You might keep a Motion Primitives morphing dialog or text effect you already like and add beUI for charts, agent chat or menus.

To migrate a single piece, install the beUI equivalent, update the import and props at each call site, then delete the old file once nothing imports it.

When is Motion Primitives the better pick?

Motion Primitives is a strong pick when you want a focused, compact set of motion building blocks, such as its text effects, morphing dialog or progressive blur, and prefer its CLI and documentation style. Pick beUI when you need a broader catalog of product controls, data visualization, AI agent interfaces or React Native versions.