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.

Setup

Choose your client, copy the config, then fill in any required environment variables.

Add to Cursor Add to VS Code

Local

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"
      ]
    }
  }
}

Remote

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