MCP

The Model Context Protocol (MCP) exposes Arrow UI’s registry metadata, tools/AI doc slugs, and llm.txt to your editor so the model can plan installs and link to docs.

What is MCP?

MCP is an open protocol that standardizes how applications provide structured context to LLMs.

Think of it as a plugin system for AI tools — enabling them to:

discover available components
understand how they work
call read-only tools (arrow_list_components, arrow_get_component, arrow_list_tools_docs, arrow_list_ai_guides, arrow_fetch_llm_txt)

Use the CLI to actually add files; MCP surfaces what exists and how to install it.

Setup

The setup depends on your AI tool.

Cursor

Create .cursor/mcp.json in your project root
Add the Arrow MCP server configuration:

{
  "mcpServers": {
    "arrowui": {
      "description": "Arrow UI registry, tools/AI doc slugs, and llm.txt",
      "command": "npx",
      "args": ["-y", "@arrowui/mcp"],
      "env": {
        "ARROWUI_REGISTRY_BASE": "https://arrowui.sh"
      }
    }
  }
}

Restart Cursor
Enable the MCP under Settings / Tools & MCPs.

See the Cursor MCP Documentation for more details.

Claude Code

Create mcp.json in your project root
Add the Arrow MCP server configuration:

{
  "mcpServers": {
    "arrowui": {
      "description": "Arrow UI registry, tools/AI doc slugs, and llm.txt",
      "command": "npx",
      "args": ["-y", "@arrowui/mcp"],
      "env": {
        "ARROWUI_REGISTRY_BASE": "https://arrowui.sh"
      }
    }
  }
}

Restart Claude Code

See the Claude MCP Documentation for more details.

VS Code

Create .vscode/mcp.json in your project root
Add the Arrow MCP server configuration:

{
  "mcpServers": {
    "arrowui": {
      "description": "Arrow UI registry, tools/AI doc slugs, and llm.txt",
      "command": "npx",
      "args": ["-y", "@arrowui/mcp"],
      "env": {
        "ARROWUI_REGISTRY_BASE": "https://arrowui.sh"
      }
    }
  }
}

Restart VS Code

See the VSCode MCP Documentation for more details.

Other AI Tools

For tools that support MCP, follow their documentation for configuring MCP servers.

You can reuse the configuration above — just adjust the file location if needed.

Usage

Once configured, you can interact with Arrow directly from your AI chat.

Browse components

Use the arrow_list_components tool to list registry items and install commands.

Component details (tool)

Use arrow_get_component with name `thinking-bar` and show dependencies and CSS markers.

llm.txt + next step

Call arrow_fetch_llm_txt to load the site index, then suggest adding the Scroll component.

Search documentation

MCP