AI-native component installation
The Ruixen UI MCP server gives your AI-assisted editor direct access to the Ruixen UI registry. Your editor sees every component name, its props, its dependencies, and the exact install command — so it can generate correct code on the first try.
No copying docs. No guessing component names. Just ask.
Free and open
@ruixen/mcp is free on npm and MIT-licensed on GitHub. No paid tiers, no gated features, no sign-up. The registry your editor reaches through the server is the same one served at ruixen.com/registry.json — there is no separate paid catalog.
- npm:
@ruixen/mcp - GitHub: ruixenui/mcp.ruixen.com
- Report an issue: github.com/ruixenui/mcp.ruixen.com/issues
Install
Add this object to your editor's MCP config file. The snippet is identical for every supported editor — only the location of the config file changes.
{
"mcpServers": {
"ruixen-mcp": {
"command": "npx",
"args": ["-y", "@ruixen/mcp@latest"]
}
}
}Restart your editor after saving. Three Ruixen tools will appear in your assistant's tool list automatically.
Where each editor stores its config
| Editor | Where to put the config |
|---|---|
| Cursor | Settings → Features → Model Context Protocol → Add new MCP server, or edit ~/.cursor/mcp.json directly |
| Claude Desktop | ~/Library/Application Support/Claude/claude_desktop_config.json (macOS) · %APPDATA%\Claude\claude_desktop_config.json (Windows) |
| Claude Code | Run claude mcp add ruixen-mcp -- npx -y @ruixen/mcp@latest |
| Windsurf | Cascade panel → MCP servers → Add server |
| Cline | MCP Servers tab in the Cline extension panel → Configure MCP Servers |
| Roo Code | MCP Servers tab in the Roo Code extension panel |
| VS Code | Depends on the MCP extension you use — consult its docs |
If your editor prefers a one-line command, point it at npx -y @ruixen/mcp@latest. That's the entire server — no separate install step, no global package.
The server has zero local state. Every call reads live from ruixen.com over HTTPS, so the moment a new component ships, your AI can reach it.
Example prompts
Once configured, talk to your assistant the way you already do:
"Add a marquee of client logos."
"Give me a blur-fade text animation component."
"I need a glass card with a hover effect."
"Build a pricing section with three tiers."
"Show me every Ruixen button with spring physics."
Your assistant calls the MCP tools behind the scenes, finds matching components, fetches their source, and hands you the exact npx shadcn@latest add … command to install them. Because the source is real, the generated code uses the real component API — no hallucinated props.
What the server exposes
Three tools, intentionally small. Most MCP-aware editors cap how many tools a single server can register; this keeps Ruixen well under every cap.
| Tool | What it does |
|---|---|
listRegistryItems | Browse the full registry with optional filters for kind, query, and pagination. |
searchRegistryItems | Ranked keyword search across names, titles, descriptions, and registry types. |
getRegistryItem | Full detail for a single component — install command, source code, related examples, and dependencies. |
How it works
The server is a stdio-based MCP implementation that fetches https://ruixen.com/registry.json on startup and individual component JSON (https://ruixen.com/r/<name>.json) on demand. There's no database, no caching layer to invalidate, and no separate sync job — your assistant always sees what's live on the site.
When it hands your editor an install command, the URL points back to ruixen.com/r/<name>.json, which the shadcn CLI reads directly. The MCP server isn't a build step; it's a typed lookup layer over the public registry.
Stay in the loop
Follow @ruixen_ui on Twitter for new components and release notes, or star the GitHub repo to track issues and pull requests.