v0.5

MCP Server

Use the createui MCP server to browse, search, and install components from registries.

The createui MCP Server allows AI assistants to interact with items from the registry. You can browse available components, search for specific ones, and install them directly into your project using natural language.

For example, you can ask an AI assistant to "Build a landing page using createui components" or "Find me a login form from the createui registry".

Quick Start

Select your MCP client and follow the instructions to configure the createui MCP server. If you'd like to do it manually, see the Configuration section.

Run the following command in your project:

pnpm dlx @create-ui/cli mcp init --client claude

Restart Claude Code and try the following prompts:

  • Show me all available components in the createui registry
  • Add the button, dialog and card components to my project
  • Create a contact form using components from the createui registry

Note: You can use /mcp command in Claude Code to debug the MCP server.

What is MCP?

Model Context Protocol (MCP) is an open protocol that enables AI assistants to securely connect to external data sources and tools. With the createui MCP server, your AI assistant gains direct access to:

  • Browse Components - List all available components, blocks, and templates from the registry
  • Search the Registry - Find specific components by name or functionality
  • Install with Natural Language - Add components using simple conversational prompts like "add a login form"

How It Works

The MCP server acts as a bridge between your AI assistant, component registries and the createui CLI.

  1. Registry Connection - MCP connects to the createui registry
  2. Natural Language - You describe what you need in plain English
  3. AI Processing - The assistant translates your request into registry commands
  4. Component Delivery - Resources are fetched and installed in your project

Configuration

You can use any MCP client to interact with the createui MCP server. Here are the instructions for the most popular ones.

Claude Code

To use the createui MCP server with Claude Code, add the following configuration to your project's .mcp.json file:

.mcp.json
{
  "mcpServers": {
    "createui": {
      "command": "npx",
      "args": ["@create-ui/cli", "mcp"]
    }
  }
}

After adding the configuration, restart Claude Code and run /mcp to see the createui MCP server in the list. If you see Connected, you're good to go.

See the Claude Code MCP documentation for more details.

Cursor

To configure MCP in Cursor, add the createui server to your project's .cursor/mcp.json configuration file:

.cursor/mcp.json
{
  "mcpServers": {
    "createui": {
      "command": "npx",
      "args": ["@create-ui/cli", "mcp"]
    }
  }
}

After adding the configuration, enable the createui MCP server in Cursor Settings.

Once enabled, you should see a green dot next to the createui server in the MCP server list and a list of available tools.

See the Cursor MCP documentation for more details.

VS Code

To configure MCP in VS Code with GitHub Copilot, add the createui server to your project's .vscode/mcp.json configuration file:

.vscode/mcp.json
{
  "servers": {
    "createui": {
      "command": "npx",
      "args": ["@create-ui/cli", "mcp"]
    }
  }
}

After adding the configuration, open .vscode/mcp.json and click Start next to the createui server.

See the VS Code MCP documentation for more details.

Codex

To configure MCP in Codex, add the createui server to ~/.codex/config.toml:

~/.codex/config.toml
[mcp_servers.createui]
command = "npx"
args = ["@create-ui/cli", "mcp"]

After adding the configuration, restart Codex to load the MCP server.

Example Prompts

Once the MCP server is configured, you can use natural language to interact with registries. Try one of the following prompts:

  • Show me all available components in the createui registry
  • Find me a login form from the createui registry

Install Items

  • Add the button component to my project
  • Create a login form using createui components
  • Build me a landing page using hero, features and testimonials sections

Troubleshooting

MCP Not Responding

If the MCP server isn't responding to prompts:

  1. Check Configuration - Verify the MCP server is properly configured and enabled in your MCP client
  2. Restart MCP Client - Restart your MCP client after configuration changes
  3. Verify Installation - Ensure createui is installed in your project
  4. Check Network - Confirm you can access the configured registries

Registry Access Issues

If components aren't loading from the registry:

  1. Check components.json - Verify your project is configured correctly
  2. Verify Registry - Confirm the registry is online and accessible
  3. Check Network - Confirm you can reach the registry endpoint

Installation Failures

If components fail to install:

  1. Check Project Setup - Ensure you have a valid components.json file
  2. Verify Paths - Confirm the target directories exist
  3. Check Permissions - Ensure write permissions for component directories
  4. Review Dependencies - Check that required dependencies are installed

No Tools or Prompts

If you see the No tools or prompts message, try the following:

  1. Clear the npx cache - Run npx clear-npx-cache
  2. Re-enable the MCP server - Try to re-enable the MCP server in your MCP client
  3. Check Logs - In Cursor, you can see the logs under View -> Output and select MCP: project-* in the dropdown.

Learn More