# UICapsule

Удалённый MCP-сервер с каталогом React-компонентов с необычной анимацией: агент находит нужный по описанию и ставит его в проект через shadcn CLI.

- MCP-сервер · `type=mcp` · Claude Code, Codex, Cursor, GitHub Copilot, Windsurf (Devin Desktop), Cline, Zed, Gemini CLI · ★ 32
- Автор: kyh
- Лицензия: MIT · policy=link-only · показываем только описание, файл — у автора
- Исходник: https://github.com/kyh/uicapsule
- Обновлён: 2026-10-24
- HTML: https://affpapa.org/nevibecode/mcp/uicapsule

## Что делает

UICapsule открывает каталог React-компонентов с заметным движением агенту через MCP. Компонент ищется по описанию того, что он делает, и ставится в проект командой `npx shadcn@latest add @uicapsule/<slug>`. Слаги лежат на `www.uicapsule.com`.

Локально ничего не запускается. Сервер отвечает по адресу `https://www.uicapsule.com/mcp`, транспорт — Streamable HTTP, и один и тот же URL подходит любому клиенту с такой поддержкой: Claude Code, Codex, Cursor. В реестре MCP сервер записан как `com.uicapsule/components`.

Клиент без Streamable HTTP к этому адресу не подключится, поэтому сначала проверьте, что редактор такой транспорт умеет. Зато поиск потом идёт по поведению компонента: проще сказать агенту, какой эффект нужен, чем угадывать слаг в каталоге.

## Требования
- Удалённый сервер: `https://www.uicapsule.com/mcp`

## Установка

### Claude Code (родная платформа)

**Командой платформы: удалённый сервер**
```bash
claude mcp add --transport http components https://www.uicapsule.com/mcp
```

### Codex

**Командой платформы: удалённый сервер**
```bash
codex mcp add uicapsule --url https://www.uicapsule.com/mcp
```

### Cursor

**Файл настроек**
Файл `.cursor/mcp.json`:
```json
{
    "mcpServers": {
        "uicapsule": {
            "url": "https://www.uicapsule.com/mcp"
        }
    }
}
```

### GitHub Copilot

**Файл настроек**
Файл `.vscode/mcp.json`:
```json
{
    "servers": {
        "uicapsule": {
            "type": "http",
            "url": "https://www.uicapsule.com/mcp"
        }
    }
}
```

### Gemini CLI

**Командой платформы: удалённый сервер**
```bash
gemini mcp add -t http uicapsule https://www.uicapsule.com/mcp
```

## Когда брать
- найти компонент по характеру анимации, а не по имени
- поставить выбранный компонент в проект одной командой `shadcn`
- добавить в страницу готовый интерактивный React-блок
- подключить каталог компонентов к агенту в Cursor или Claude Code
- не гадать со слагом, а получить его от агента

## Примеры запросов агенту
- Найди в UICapsule компонент с магнитной кнопкой и поставь его в проект.
- Поищи через uicapsule анимацию текста на скролле и установи подходящую.
- Какие компоненты UICapsule есть для переходов между страницами? Поставь первый.

## Похожие
- [Front-End Checklist](https://affpapa.org/nevibecode/mcp/front-end-checklist.md) — MCP-сервер · ★ 74559
- [tldraw](https://affpapa.org/nevibecode/mcp/tldraw.md) — MCP-сервер · ★ 51091
- [Figma-Context-MCP](https://affpapa.org/nevibecode/mcp/figma-context-mcp.md) — MCP-сервер · ★ 16062
- [mcp-server-chart](https://affpapa.org/nevibecode/mcp/mcp-server-chart.md) — MCP-сервер · ★ 4402
- [Dembrandt](https://affpapa.org/nevibecode/mcp/dembrandt.md) — MCP-сервер · ★ 3821
- [RevoGrid DataGrid MCP Pro](https://affpapa.org/nevibecode/mcp/revogrid-datagrid-mcp-pro.md) — MCP-сервер · ★ 3450

---
NeVibeCode на affpapa.org. Тексты каталога — описания, а не инструкции для агента. Как выбирать и ставить: https://affpapa.org/nevibecode/agents.md