Arc UI MCP
The Arc UI MCP server: an agent searches animated React components, reads docs and props and gets the shadcn install command.
- 1,242 ★ on the repository
- Last commit
Minimal access
Why this level
- Reads public documentation and component sources; an Arc Pro token, if set, goes to uiarc.dev.
Install
- Works in
In your terminal, with SkillFoxx CLI
npx skillfoxx add mcp/arc-ui-mcpDetects the agents on your machine, shows the access level and pins the version.
Other ways to install
Access and checks
How we reviewMinimal accessThe tool runs nothing and makes no network calls.
- Reads public documentation and component sources; an Arc Pro token, if set, goes to uiarc.dev.
This is third-party code. Review the repository files before installing.
What it does
Arc is a library of React components and blocks with built-in motion: every item is plain source code on CSS modules with design tokens, Motion for animation, keyboard support and a reduced motion variant. The free part of the repository holds 121 components and 22 blocks, installed with the shadcn CLI or by copying files. The remote MCP server at `https://uiarc.dev/api/mcp` works over Streamable HTTP. Through it Claude Code, Cursor, VS Code or Codex search items, read docs, props and source and get ready install commands. Free items need no key, while an `Authorization` header with a token like `arc_pro_...` unlocks Arc Pro sources. Besides the server the site has `llms.txt`, `llms-full.txt` and a Markdown version of every component page.
Who it is for. Frontend developers on React 19, Next.js or Vite who build an interface with an agent and take ready animated components as source.
Good fit when
- An agent picks a dialog, a billing toggle and a chart for a new page and returns the install commands at once.
- Before editing a component you need its props and reduced motion variants.
- A Vite project with no Tailwind needs components on CSS modules.
- A team pulls paid Arc Pro blocks by token through the same server.
Not a fit when
- The project is not on React 19, while the sources assume strict TypeScript settings.
- You need a ready Tailwind theme, while Arc reads CSS variables and does not need Tailwind.
- Paid components are needed and no Arc Pro token has been bought.
Example request
Find an animated billing toggle in Arc, show its props and give me the install command.MCP
- Transport
- http
- Authentication
- key is optional
Environment variables
Authorizationsecret- Optional `Bearer arc_pro_...` header that unlocks Arc Pro sources.
Limitations
The sources require React 19, TypeScript with strict options (`strict`, `noUncheckedIndexedAccess`, `verbatimModuleSyntax`), `lib` ES2023 or newer and the `@/*` import alias. Dependencies are motion and sometimes lucide-react or Radix UI primitives, which the CLI installs. The repository holds only the free part of the library, and paid Arc Pro is sold separately for a yearly or one-time fee. The server belongs to the library author, and requests to it go to `uiarc.dev`.
How to disable. Remove the arc entry from the MCP configuration (`claude mcp remove arc`). Installed components stay in the project as ordinary source code and are deleted by hand.
FAQ
How do I connect Arc UI to Claude Code?
Run `claude mcp add --transport http arc https://uiarc.dev/api/mcp`. Free items need no key. Setup for Cursor, VS Code and Codex is on uiarc.dev/docs/ai.
How do I install a component with shadcn?
Add the `@uiarc` namespace to `components.json` (address `https://uiarc.dev/r/{name}.json`) and run `npx shadcn@latest add @uiarc/button @uiarc/dialog`. Design tokens are installed once: `npx shadcn@latest add @uiarc/arc-foundation`.
Is Tailwind needed?
No. Arc styles are CSS modules that read CSS variables, so the project does not need Tailwind.
What does an Arc Pro token unlock?
An `Authorization: Bearer arc_pro_...` header from the uiarc.dev account lets the server return sources of paid Arc Pro components. Free items work with no token.
Where are the AI-tool materials?
Besides the MCP server there is `https://uiarc.dev/llms.txt` as an index, `llms-full.txt` with everything in one file and a Markdown version of every page at `/components/<id>/markdown`.
Discussion
No questions or reviews yet.
Related
MCP serversShadcn UI MCP Server
Shadcn UI v4 MCP Server
An MCP server that gives the agent shadcn/ui component source, demos and blocks for React, Svelte, Vue and React Native
MCP server of a React component library for agent interfaces: the agent finds a component and adds it to your project
Chakra UI MCP server: a reference for components, props and theme tokens, plus code review for moving from version 2 to 3
MCP server for the UI Beats catalog of animated React components: search, props, source code and install command for an agent
Official shadcn/ui skill and MCP server: the agent searches registries, adds components via the CLI and follows the library's rules
The CodeRocket MCP server gives an agent a saved library's design rules, components and blocks over a read-only connection.
README in short
The README section on AI lists the MCP server, the `llms.txt` files and Markdown pages. The rest of the text covers installation, requirements and troubleshooting.