affectUI

Name: affectUI
Author: flohoeller

flohoeller

Handcrafted React components, illustrations and motion for AI products. One file each, calm motion, dark mode built in. Install with the shadcn CLI – free and open source.

接入配置

选择客户端，复制配置，再按项目文档补齐环境变量。

一键添加到 Cursor 一键添加到 VS Code

本地运行

claude mcp add affectui -- npx shadcn@latest add https://www.affectui.com/r/reaction-bar.json

~/.codex/config.toml

[mcp_servers.affectui]
command = "npx"
args = ["shadcn@latest", "add", "https://www.affectui.com/r/reaction-bar.json"]

# codex mcp add affectui -- npx shadcn@latest add https://www.affectui.com/r/reaction-bar.json

~/.cursor/mcp.json

{
  "mcpServers": {
    "affectui": {
      "command": "npx",
      "args": [
        "shadcn@latest",
        "add",
        "https://www.affectui.com/r/reaction-bar.json"
      ]
    }
  }
}

.vscode/mcp.json

{
  "servers": {
    "affectui": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "shadcn@latest",
        "add",
        "https://www.affectui.com/r/reaction-bar.json"
      ]
    }
  }
}

~/.gemini/settings.json

{
  "mcpServers": {
    "affectui": {
      "command": "npx",
      "args": [
        "shadcn@latest",
        "add",
        "https://www.affectui.com/r/reaction-bar.json"
      ]
    }
  }
}

claude_desktop_config.json

{
  "mcpServers": {
    "affectui": {
      "command": "npx",
      "args": [
        "shadcn@latest",
        "add",
        "https://www.affectui.com/r/reaction-bar.json"
      ]
    }
  }
}

.trae/mcp.json

{
  "mcpServers": {
    "affectui": {
      "command": "npx",
      "args": [
        "shadcn@latest",
        "add",
        "https://www.affectui.com/r/reaction-bar.json"
      ]
    }
  }
}

远程托管

claude mcp add --transport http affectui https://www.affectui.com/api/mcp --header 'Authorization: <AUTHORIZATION>'