rive-mcp — MCP-сервер для Claude Code: анимация Rive
Сервер позволяет создавать, проверять и редактировать .riv-анимации, а затем просматривать их кадры и экспорты. Пригодится, если нужно работать с Rive из чата с ИИ.
claude mcp add rive-mcp -- npx -y rive-mcp-serverЧто делает rive-mcp
rive-mcp даёт MCP-клиенту инструменты для работы с файлами .riv: можно собрать анимацию из JSON-описания сцены, изменить готовый файл и проверить его структуру. Сервер также импортирует SVG как векторные формы и создаёт рендеры в PNG, GIF, APNG, WebM или в виде спрайт-листа. Рендеринг использует официальный Rive runtime в headless Chromium.
Для правок есть локальная Studio с холстом, иерархией объектов, инспектором и таймлайном; изменения видны сразу. Инструменты также умеют запускать состояния машины состояний и находить некоторые ошибки, например недостижимые состояния. Это повод учитывать формат результата: звук, встроенный в .riv, воспроизводится только в GPU-версии Rive runtime, а не в предпросмотре сервера.
Какие задачи решает
- создать
.riv-анимацию по описанию сцены в JSON - проверить структуру файла и найти ошибки машины состояний
- импортировать SVG-иллюстрацию в Rive
- выгрузить анимацию в GIF или спрайт-лист
- сгенерировать код подключения Rive для React или Flutter
Примеры запросов агенту
- Создай
.riv-анимацию карточки с появлением и плавным движением. - Проверь файл
.rivи перечисли проблемы в машине состояний. - Импортируй SVG-иконку и подготовь PNG-кадры анимации.
Как установить rive-mcp
Командой платформы
claude mcp add rive-mcp -- npx -y rive-mcp-serverКомандой платформы
codex mcp add rive-mcp -- npx -y rive-mcp-serverФайл настроек
{
"mcpServers": {
"rive-mcp": {
"command": "npx",
"args": [
"-y",
"rive-mcp-server"
]
}
}
}Файл настроек
{
"servers": {
"rive-mcp": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"rive-mcp-server"
]
}
}
}Командой платформы
gemini mcp add rive-mcp npx -y rive-mcp-serverПо шагам, с командами для каждой платформы: Как подключить MCP-сервер: Claude Code, Codex, Cursor, VS Code, Gemini CLI и другие
Вопросы о rive-mcp
Как установить rive-mcp в Claude Code?
Выполните claude mcp add rive-mcp -- npx -y rive-mcp-server. Эта команда добавляет MCP-сервер rive-mcp.
Что делает rive-mcp?
Он позволяет создавать и править .riv-файлы, проверять их содержимое и экспортировать анимации в изображения и видеоформаты.
Можно ли прослушать встроенное аудио в предпросмотре сервера?
Нет. Аудио из .riv воспроизводится в GPU-версии Rive runtime, но не в предпросмотре самого сервера.