Search, inspect, and install animated React components from UI Beats through MCP-compatible coding agents.
Copy the AI prompt to install this server into Claude Code, Cursor, or another agent — or use 1-click editor setup below.
We haven't yet run this listing's install command through our automated sandbox check. This isn't a red flag — we're steadily working through the catalog.
💡 Paste the JSON block into your client's configuration file under mcpServers, then restart the application.
Inspect callable tools, capabilities, and parameters exposed to AI agents by UI Beats.
The UI Beats MCP server gives coding agents access to a catalogue of animated React components. The components are built with TypeScript, Tailwind CSS, and Motion, and are intended to be copied into the application rather than imported from a runtime package. Developers retain the component source and can modify it after installation.
The catalogue contains 52 components in animation, background, button, card, general component, and text categories. Examples include animated lists, beams, buttons, card effects, tabs, timelines, text reveals, and ticker components. Each component has documented props and an installation path.
Agents can query the catalogue through four MCP tools: search_components, get_component, list_components, and get_install_command. A typical workflow is to search by name or category, inspect a matching component and its props, then request the command needed to add it to the project.
Installation uses the shadcn CLI. The returned command points to a UI Beats registry entry, and the CLI writes the component into the application while installing the npm packages required by that component. The MCP server therefore provides discovery and implementation details, while the resulting code remains part of the user’s project.
The same content is also available over documented URLs for agents that only retrieve web resources. These include an index of component markdown files, a full text export, individual component pages in markdown, and a JSON catalogue containing props and guidance.
Add the server to Claude Code with:
The command runs the package through npx and does not require an environment variable according to the provided setup instructions. The repository also documents local development for contributors: Node 20.9 or newer and Yarn 4 through Corepack are required. After cloning the repository, run corepack enable, yarn install, and yarn dev to start the site locally.
The UI Beats MCP server supports these operations:
The component library uses shadcn theme variables such as card, border, and muted foreground values. Components also honor prefers-reduced-motion; the project states that this behavior is checked across the registry. These details matter when an agent is selecting components for an existing themed interface or an accessibility-conscious application.
The UI Beats MCP server supplies component code and installation information; it is not described as a conventional package that applications import. The available material does not document authentication, server-side data access, or project-specific code modification beyond returning component source and install commands.
Components can also be copied manually from their documentation pages. The catalogue and component count may change as the project evolves, so agents should query the available entries rather than assume that every listed component remains unchanged.
Factual signals from GitHub, npm, and our automated checks — not a rating.
No reviews yet — be the first to share how this listing worked for you.
Showcase your server listing on GitHub or your project documentation. Embed this dynamic SVG badge to highlight official listing status and live engagement.
[](https://allmcps.com/mcp/ui-beats)<a href="https://allmcps.com/mcp/ui-beats"><img src="https://allmcps.com/api/badge/ui-beats?style=directory" alt="UI Beats on AllMCPs" /></a>