echo-ui-mcp

An MCP server for Echo UI. It gives a coding agent five tools over the Echo UI registry, so the agent can look up a component's props, usage, accessibility notes and anti-patterns before it writes code with it.

Install

Every client runs the same command:

{
  "mcpServers": {
    "echo-ui": {
      "command": "npx",
      "args": ["-y", "echo-ui-mcp"]
    }
  }
}

• Claude Code: claude mcp add echo-ui -- npx -y echo-ui-mcp
• Cursor: add the block above to .cursor/mcp.json.
• VS Code: add it to .vscode/mcp.json, under servers instead of mcpServers.
• Other clients: any client that runs a stdio MCP server takes the same command.

Requires Node.js 20 or later.

Tools

| Tool | Takes | Answers with | | --- | --- | --- | | search_components | query? | One line per matching component, with its install command. With no query, every component. | | get_component | name | The full record: description, install command, usage, composition, examples, accessibility, motion & sound, props and anti-patterns. Accepts echo-hardware-button, hardware-button or HardwareButton. | | get_tokens | — | The colour roles (--echo-*), sound names and motion names. | | get_examples | name | Just the examples for one component. | | get_accessibility | name? | The rules a consumer of Echo can still get wrong. With a name, that component's own record of what was tested and what is not. |

When it connects, the server also sends instructions: how to set the project up, how to wire the theme and sound, and the corrections agents most often need (Base UI's package is @base-ui/react; Echo components are installed with npx echo-ui-cli add, not npm install).

get_component returns the same text as the component's page in the Echo UI docs and its entry in llms-full.txt, plus what the component ships as: its version, the echo-ui-core range it needs, and its accessibility record. That half is read from the same registry echo-ui-cli installs from, with the same client, so the two cannot disagree.

Configuration

The server reads two published documents and re-reads them after five minutes: the catalog at https://echo-ui.com/r/catalog.json and the registry at https://echo-ui.com/e. To point it at a fork or a local build, set either:

{
  "mcpServers": {
    "echo-ui": {
      "command": "npx",
      "args": ["-y", "echo-ui-mcp"],
      "env": {
        "ECHO_CATALOG": "/absolute/path/to/catalog.json",
        "ECHO_REGISTRY": "https://example.com/e"
      }
    }
  }
}

If the registry cannot be reached the server still answers from the catalog, without versions. If a file does not match the hash the registry published for it, the server says so rather than answering.

License

MIT