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

Run the following command in your project:

pnpm dlx @arrowui/mcp@latest init --client cursor

Enable the Arrow MCP server in Cursor settings, then try:

List Arrow UI registry components and their install commands.
Show the full manifest for code-block.
Fetch llm.txt and link me to the relevant docs pages.

Configuration

The setup depends on your AI tool.

Cursor

Create .cursor/mcp.json in your project root and add:

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

See the Cursor MCP Documentation for more details.

Claude Code

Create .mcp.json in your project root and add:

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

See the Claude MCP Documentation for more details.

VS Code

Create .vscode/mcp.json in your project root and add:

{
  "servers": {
    "arrowui": {
      "command": "npx",
      "args": ["-y", "@arrowui/mcp"]
    }
  }
}

See the VSCode MCP Documentation for more details.

OpenCode

Create opencode.json in your project root and add:

{
  "$schema": "https://opencode.ai/config.json",
  "mcp": {
    "arrowui": {
      "type": "local",
      "command": ["npx", "-y", "@arrowui/mcp"],
      "enabled": true
    }
  }
}

See the OpenCode 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