Guide to the N8N Chat UI MCP server

The N8N Chat UI MCP server connects your account to AI tools that support the Model Context Protocol (MCP). Once connected, you can list, create, and customize chat widgets from compatible clients (Claude Desktop, Cursor, Windsurf, VS Code, Claude Code, and others). Those widgets use the same webhooks and response shape as widgets you build in the dashboard; see Backend integration for the JSON your workflow or API should return.

You can connect in two ways:

• OAuth (recommended) - Sign in through your browser; no API key to manage.
• API key - For environments where OAuth is not available; generate a key in your dashboard.

Quick Setup

OAuth (recommended):

npx add-mcp https://n8nchatui.com/api/mcp

API key:

npx add-mcp https://n8nchatui.com/api/mcp --header "Authorization: Bearer YOUR_API_KEY"

Run the command from a project folder (or add -g for a global install that applies to your user profile across projects). Then restart your editor (or fully quit and reopen clients like Claude Desktop). The first time you use the server, your browser may open for OAuth. Review the permissions and click Authorize.

OAuth (recommended)

Connect using OAuth. No API key configuration is required.

npx add-mcp https://n8nchatui.com/api/mcp

Or add this to your MCP config file (merge with existing mcpServers if you already have entries):

{
  "mcpServers": {
    "n8n-chat-ui": {
      "type": "http",
      "url": "https://n8nchatui.com/api/mcp"
    }
  }
}

Restart your editor if it does not pick up the new server. The first time you use the connection, your browser may open for OAuth. Review the permissions and click Authorize to finish.

API Key

Connect using API key authentication. Use this for remote agents or clients where OAuth is not available.

Requires: an MCP API key from Settings.

npx add-mcp https://n8nchatui.com/api/mcp --header "Authorization: Bearer <YOUR_API_KEY>"

Or add this to your MCP config file:

{
  "mcpServers": {
    "n8n-chat-ui": {
      "type": "http",
      "url": "https://n8nchatui.com/api/mcp",
      "headers": {
        "Authorization": "Bearer YOUR_API_KEY"
      }
    }
  }
}

Get your API key

1. Open Dashboard → Settings.
2. In the MCP API Key section, choose Generate Key (or Regenerate if you already have one).
3. Copy the key immediately. It is only shown once.

Connect to Claude Desktop

1. Open Claude Desktop → Settings → Connectors -> Add Custom Connector
2. Add the server URL: https://n8nchatui.com/api/mcp
3. Complete sign-in and Authorize when prompted.

Setup: walkthrough for connecting Claude Desktop to the N8N Chat UI MCP server.

Demo: using natural language in Claude to customize your widgets.

Supported actions (tools)

The N8N Chat UI MCP server provides the following actions, which are exposed as tools to MCP clients. You can use these tools to interact with your chat widgets using natural language.

• list_widgets - List your chat widgets.
• create_widget - Create a widget (name, embed type, display type). Optional appearance hints can also be applied.
• customize_widget - Update theme only (colors, text, layout, and other fields in the configuration schema). Does not change name, embed type, display type, or webhooks.

Try asking: “List my chat widgets” or “Create a new widget called Support Bot with the Facebook theme”

Troubleshooting

Server not loading

• Fully quit your client and open it again (many clients only read MCP config at startup).
• Start a new chat so the client reloads available tools.
• Confirm the URL is exactly: https://n8nchatui.com/api/mcp

401 Unauthorized

• For API key mode: generate a new key in Settings and update your config or re-run add-mcp with the new header.
• For OAuth: complete the browser authorization flow again if your session expired.

Tools missing

• In your client’s MCP settings, confirm the n8n-chat-ui server is enabled.
• If you edited JSON by hand, validate syntax (no trailing commas).

Security