Ui Debugger

# Install the MCP server `io.github.developerz-ai/ui-debugger-mcp`

Its page: https://plug.directory/servers/io.github.developerz-ai/ui-debugger-mcp

It runs on the person's machine and needs Node.js installed.

Ask the person for `YOUR_OPENAI_API_KEY` and put it in place of the placeholder; never invent a value.

Use the section for the person's client.

## Claude Desktop, Cursor, Devin Desktop, Cline, LM Studio, Gemini CLI, mcp-client-cli, oterm, TUUI, BoltAI, AnythingLLM, Augment Code, Bob Shell, ECA, Kiro, Kiro CLI

Merge into the place for the person's client:

- Claude Desktop: claude_desktop_config.json (Settings › Developer › Edit Config)
- Cursor: ~/.cursor/mcp.json
- Devin Desktop: ~/.config/devin/mcp_config.json
- Cline: cline_mcp_settings.json (MCP Servers › Configure › Configure MCP Servers)
- LM Studio: mcp.json (Program › Install › Edit mcp.json)
- Gemini CLI: ~/.gemini/settings.json
- mcp-client-cli: ~/.llm/config.json
- oterm: config.json in oterm's data folder (~/Library/Application Support/oterm on macOS, ~/.local/share/oterm on Linux, %APPDATA%\oterm on Windows)
- TUUI: resources/assets/config/mcp.json in the installed app
- BoltAI: ~/.boltai/mcp.json
- AnythingLLM: anythingllm_mcp_servers.json in the AnythingLLM storage plugins directory
- Augment Code: Augment Settings Panel – MCP section – Import from JSON (VS Code extension)
- Bob Shell: ~/.bob/settings/mcp.json (global) or .bob/mcp.json (project)
- ECA: ~/.config/eca/config.json (global) or .eca/config.json in the project
- Kiro: ~/.kiro/settings/mcp.json (user) or .kiro/settings/mcp.json (workspace)
- Kiro CLI: ~/.kiro/settings/mcp.json (user) or .kiro/settings/mcp.json (workspace)

```json
{
  "mcpServers": {
    "ui-debugger-mcp": {
      "command": "npx",
      "args": ["-y", "@developerz.ai/[email protected]"],
      "env": { "OPENAI_API_KEY": "YOUR_OPENAI_API_KEY" }
    }
  }
}
```

## Claude Code

Run in a terminal:

```sh
claude mcp add --env OPENAI_API_KEY=YOUR_OPENAI_API_KEY --transport stdio ui-debugger-mcp -- npx -y @developerz.ai/[email protected]
```

## VS Code

Merge into .vscode/mcp.json:

```json
{
  "servers": {
    "ui-debugger-mcp": {
      "type": "stdio",
      "command": "npx",
      "args": ["-y", "@developerz.ai/[email protected]"],
      "env": { "OPENAI_API_KEY": "YOUR_OPENAI_API_KEY" }
    }
  }
}
```

## Zed

Merge into ~/.config/zed/settings.json:

```json
{
  "context_servers": {
    "ui-debugger-mcp": {
      "command": "npx",
      "args": ["-y", "@developerz.ai/[email protected]"],
      "env": { "OPENAI_API_KEY": "YOUR_OPENAI_API_KEY" }
    }
  }
}
```

## Continue

Merge into ~/.continue/config.yaml:

```yaml
mcpServers:
  - name: "ui-debugger-mcp"
    type: stdio
    command: "npx"
    args:
      - "-y"
      - "@developerz.ai/[email protected]"
    env:
      "OPENAI_API_KEY": "YOUR_OPENAI_API_KEY"
```

## Goose

Merge into ~/.config/goose/config.yaml:

```yaml
extensions:
  "ui-debugger-mcp":
    type: stdio
    name: "ui-debugger-mcp"
    enabled: true
    cmd: "npx"
    args: ["-y", "@developerz.ai/[email protected]"]
    env_keys: []
    envs: { "OPENAI_API_KEY": "YOUR_OPENAI_API_KEY" }
    timeout: 300
```

## Codex

Run in a terminal:

```sh
codex mcp add ui-debugger-mcp --env OPENAI_API_KEY=YOUR_OPENAI_API_KEY -- npx -y @developerz.ai/[email protected]
```

## Agenvoy

Merge into ~/.config/agenvoy/mcp.json:

```json
{
  "servers": {
    "ui-debugger-mcp": {
      "command": "npx",
      "args": ["-y", "@developerz.ai/[email protected]"],
      "env": { "OPENAI_API_KEY": "YOUR_OPENAI_API_KEY" }
    }
  }
}
```

## Amp

Merge into ~/.config/amp/settings.json (user) or .amp/settings.json (workspace):

```json
{
  "amp.mcpServers": {
    "ui-debugger-mcp": {
      "command": "npx",
      "args": ["-y", "@developerz.ai/[email protected]"],
      "env": { "OPENAI_API_KEY": "YOUR_OPENAI_API_KEY" }
    }
  }
}
```

Then restart the client, or reload its MCP servers, and ask it to list the server's tools to confirm it started.