Design

affectui.com

An MCP server that lets you search, list, and fetch documentation or source code for affectUI UI components, screens, blocks, illustrations, and motion effects.

1 endpoint4 known toolsFirst detected October 10, 2026Last detected October 10, 2026

ENDPOINT 1

https://www.affectui.com/api/mcp

No auth detected

MCP server metadata

Name: affectui
Version: 1.0.0

Capabilities

tools.listChangedresources.listChangedprompts.listChanged

Server instructions

affectUI is a library of agent-ready React UI for AI products and SaaS. Every item is one .tsx file with its styles inside – no Tailwind, no animation library, no other dependencies (React 19). Workflow: search_components (or list_components) → get_component for docs, usage and props → install it. Installing: prefer the shadcn CLI command from get_component – it puts the file in components/ui. If the CLI isn't available, use get_source and write the file to components/ui/<slug>.tsx yourself. Keep the component's own styles and motion; adapt content and props to the app. Pro items need the user's affectUI access key.

Known tools 4

search_components

Find affectUI components, screens, blocks, illustrations and motion effects for a UI need, e.

Inferred read-only

list_components

Every affectUI item with slug, section, category, free or Pro, and a one-line description.

Inferred read-only

get_component

Docs for one item: install command, usage example, props, keyboard, accessibility and notes.

Potential side effects

get_source

The full .

Inferred read-only

CONNECT WITH APPROVAL

Client installation

Review this server and its permissions before adding it. Secret placeholders must be set locally.

Codex

~/.codex/config.toml

[mcp_servers.affectui]
url = "https://www.affectui.com/api/mcp"
enabled = true

Claude Code

.mcp.json

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

Claude Desktop

Settings → Connectors → Add custom connector

Name: affectui
Remote MCP URL: https://www.affectui.com/api/mcp

Add this remote URL as a custom connector in Claude Desktop. Availability depends on the user plan and workspace policy.

Cursor

.cursor/mcp.json

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

Visual Studio Code

.vscode/mcp.json

Add to Visual Studio Code

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

Generic MCP

Client-specific MCP configuration

{
  "name": "affectui",
  "transport": "streamable-http",
  "url": "https://www.affectui.com/api/mcp"
}

MCP Inspector

Run the official MCP Inspector locally and enter the indexed Streamable HTTP endpoint.

TRUST AND VERIFICATION EVIDENCE

Loading Trust v2 evidence…

Checking the associated registrable domain. The BuiltWith key remains server-side.

Indexed

Evidence is source-attributed and does not guarantee that a third-party server is safe. Risk labels are conservative metadata heuristics.