marmo-ui — MCP-сервер для Claude Code: живое API React-дизайн-системы
Подключает агента к живым API компонентов Marmo UI, чтобы он собирал дашборды на реальных пропсах, а не выдумывал их.
claude mcp add --transport http marmo-ui https://mcp.marmoui.com/mcpЧто делает marmo-ui
Marmo UI — это React 19 дизайн-система под MIT: таблицы, графики, формы, каркасы приложений, светлая и тёмная темы из одного набора токенов. MCP-сервер отдаёт агенту актуальные описания компонентов, правила композиции и проверку сгенерированного кода через review_generated_code. Неверные импорты и несуществующие пропсы отлавливаются до того, как вы откроете файл.
Сервер хостится на https://mcp.marmoui.com/mcp, ставить локально нечего. Компонентная библиотека живёт отдельно: npm i @marmoui/ui, а react и react-dom версии 19 идут как peer-зависимости. Для Claude есть плагин из маркетплейса mahmoudilyan/marmoui — он кладёт внутрь MCP, скилл marmo-ui и команды /marmo-ui:init, /marmo-ui:design-md, /marmo-ui:build.
Бесплатный уровень даёт корректную генерацию в стиле Marmo. Свой бренд — цвета, шрифты, токены, переопределения компонентов — это Pro за $9.99 в месяц с 14-дневным пробным периодом: нужен DESIGN.md и персональный токен MCP. Генерация идёт в вашем агенте на ваших токенах LLM, код остаётся в вашем репозитории.
Какие задачи решает
- собрать дашборд с таблицами и графиками на готовых компонентах
- поймать выдуманные пропсы и битые импорты до ревью
- подключить агента к актуальному API библиотеки вместо догадок из обучающих данных
- сгенерировать интерфейс в фирменных цветах и токенах
- держать светлую и тёмную темы на одном наборе токенов
Примеры запросов агенту
- Собери дашборд для биллинга на Marmo UI.
- Прогони сгенерированный код через review_generated_code и почини замечания.
- Собери форму создания пользователя по компонентам из @marmoui/ui
Как установить marmo-ui
Командой платформы: удалённый сервер
claude mcp add --transport http marmo-ui https://mcp.marmoui.com/mcpКомандой платформы: удалённый сервер
codex mcp add marmo-ui --url https://mcp.marmoui.com/mcpФайл настроек
{
"mcpServers": {
"marmo-ui": {
"url": "https://mcp.marmoui.com/mcp"
}
}
}Файл настроек
{
"servers": {
"marmo-ui": {
"type": "http",
"url": "https://mcp.marmoui.com/mcp"
}
}
}Командой платформы: удалённый сервер
gemini mcp add -t http marmo-ui https://mcp.marmoui.com/mcpПо шагам, с командами для каждой платформы: Как подключить MCP-сервер: Claude Code, Codex, Cursor, VS Code, Gemini CLI и другие
Вопросы о marmo-ui
Как установить marmo-ui в Claude Code?
Одной командой: claude mcp add --transport http marmo-ui https://mcp.marmoui.com/mcp. Если нужен плагин с командами и скиллом, сначала добавьте маркетплейс /plugin marketplace add mahmoudilyan/marmoui, затем поставьте плагин /plugin install marmo-ui@marmoui-plugins.
Что делает marmo-ui?
Отдаёт агенту живое API React-дизайн-системы: пропсы компонентов, паттерны композиции и проверку сгенерированного кода. Агент собирает интерфейс на реальных компонентах, а не на придуманных.
Нужен ли аккаунт для работы с marmo-ui?
Нет, бесплатный уровень и команда npx marmoui init работают без аккаунта. Персональный токен MCP нужен только для Pro-режима с генерацией в вашем бренде.
