affectUI MCP server

Lets an agent search affectUI items, read their docs, props, and install commands, and fetch component source.

Before you start

Docs for every item are open. Pro source needs the AFFECTUI_TOKEN access key from https://www.affectui.com/account/downloads, sent in the Authorization header.
Installs run through the shadcn CLI, which needs the same key for Pro items.

MCP server setup

{
  "mcpServers": {
    "affectui": {
      "type": "http",
      "url": "https://www.affectui.com/api/mcp"
    }
  }
}{
  "mcpServers": {
    "affectui": {
      "type": "http",
      "url": "https://www.affectui.com/api/mcp"
    }
  }
}

Add to .mcp.json. Start Claude Code in the project and approve the affectui server when asked.

Agent setup prompt

Paste this into a coding agent to set affectUI MCP server up in the client you use.

Set up affectUI MCP server (https://www.affectui.com/docs/ai) for the AI client I use with this project.

MCP server "affectui":
- Remote Streamable HTTP endpoint: https://www.affectui.com/api/mcp
- Needs no sign-in or API key.
- Config file per client: Claude Code: .mcp.json; Cursor: .cursor/mcp.json; VS Code: .vscode/mcp.json; Codex: ~/.codex/config.toml.

Before you start:
- Docs for every item are open. Pro source needs the AFFECTUI_TOKEN access key from https://www.affectui.com/account/downloads, sent in the Authorization header.
- Installs run through the shadcn CLI, which needs the same key for Pro items.

Steps:
1. Ask which client I use if you can't tell.
2. For Claude Code, Cursor, VS Code, or Codex, add the "affectui" server to that client's config file, using its documented format. Keep every server and setting already in the file.
3. Reload the client, finish any sign-in, and confirm the server's tools are listed.

Never write a secret value into a config file or ask me to paste one into this chat. If anything here differs from the provider's guide, follow the guide.