beUI is a free, MIT-licensed collection of animated React and Next.js components built on Tailwind CSS and Framer Motion, distributed through the shadcn CLI so product teams can install individual components or copy their source and own the code.

What it is

beUI is a motion component library for React and Next.js, written in TypeScript and published under the MIT licence. It lives inside the shadcn/ui ecosystem rather than beside it: components are shadcn-compatible registry items addressed through a @beui namespace, the full catalog is served at /r/registry.json, and each item is available as a registry JSON file at /r/{slug}.json with raw source at /r/{slug}/raw. The library is organized into collections covering motion primitives, composed blocks, AI agent interfaces, charts, casino games, and a React Native set, all documented on beui.dev with live previews and copyable usage examples.

The concrete problem it solves is the ownership gap in animated UI. Motion work is either rebuilt from scratch in every product or pulled in as an opaque dependency that the application team cannot reasonably change. beUI ships each component as source that is installed into the app, so the team reads it, edits it, and adapts it to the product — the stated principle is to copy the source and own the code. That replaces the versioned third-party widget package as the delivery model for animated interface pieces, and it gathers into one registry several categories that are normally sourced separately: primitives, composed widgets, data visualizations, AI conversation surfaces, and small games.

Key capabilities

• Installs any component into a project configured for shadcn/ui through the @beui namespace, for example npx shadcn@latest add @beui/animated-toast-stack, or by passing a direct URL such as https://beui.dev/r/animated-toast-stack.json to the CLI.
• Supports a manual path as well: the component page exposes the source and supporting files for copying instead of CLI installation.
• Covers motion primitives such as animated breadcrumbs, color selectors, buttons, tabs, and tooltips, alongside composed blocks including command palettes, file uploads, and signup forms.
• Provides dedicated collections for AI agent interfaces (chat layouts, prompt inputs, messages, approvals, and tool results), charts (composition, ranking, funnel, calendar, and financial visualizations), and casino games (Crash, Mines, Plinko, and Slide, with fair or server-decided outcomes).
• Builds motion from springs, shared layouts, and press feedback, with shared animation tokens kept in lib/ease.ts.
• Includes keyboard behavior and reduced-motion support where applicable, backed by an accessibility-only test suite run with bun test.
• Exposes the catalog to coding agents through a public MCP server at https://mcp.beui.dev/mcp requiring no license key, with /llms.txt for a documentation index and an installable skill via npx skills add starc007/ui-components --skill beui.

Who uses it and how

• Product teams building React and Next.js interfaces who want motion on everyday elements such as buttons, navigation, and menus without maintaining an animation layer themselves.
• Teams shipping AI products, which use the agents collection for chat layouts, prompt inputs, messages, approvals, and tool results rather than designing conversation surfaces from scratch.
• Teams that need data visualization, drawing on the chart collection for composition, ranking, funnel, calendar, and financial views.
• Teams building casino-style games, which take Crash, Mines, Plinko, or Slide with either fair or server-decided outcomes.
• Mobile teams working in Expo and React Native, which use the beUI Native components and preview each one through a clip and an Expo Go preview.

Getting started

In a project already configured for shadcn/ui, add a component with npx shadcn@latest add @beui/animated-toast-stack, or use the direct registry URL shown on the component's page. To work on the library or documentation site locally, install Bun, clone the repository, then run bun install and bun run dev and open http://localhost:3000.

How it compares

beUI positions itself inside the shadcn/ui registry ecosystem as an added namespace rather than as a separate framework, so it complements an existing shadcn/ui setup instead of replacing it. The facts name no other animated component library of this kind, so within this registry it stands alone as the motion-focused counterpart to a shadcn/ui installation.

When to use it — and when not to

Choose beUI when the team wants animation it can read and modify, and when a shadcn/ui-configured React or Next.js codebase already exists to install into. Because components arrive as source rather than as a versioned dependency, upstream fixes and changes reach an application only when someone re-installs or merges them, so the team carries that maintenance itself, and adopting the library means working with Tailwind CSS and Framer Motion. Running the library or documentation site locally also means installing Bun, and teams that want a drop-in package with automatic updates should look elsewhere.

npx shadcn@latest add @beui/animated-toast-stack

npx shadcn@latest add https://beui.dev/r/animated-toast-stack.json

https://mcp.beui.dev/mcp

npx skills add starc007/ui-components --skill beui

git clone https://github.com/starc007/ui-components.git
cd ui-components
bun install
bun run dev

bun run check
bun test

npx skills add starc007/ui-components --skill beui-pro