> ## Documentation Index
> Fetch the complete documentation index at: https://rive-transitions-2.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Rive MCP Integration

export const YouTube = ({id, timestamp}) => {
  const videoSrc = timestamp ? `https://www.youtube.com/embed/${id}?start=${timestamp}` : `https://www.youtube.com/embed/${id}`;
  return <iframe width="100%" height="400" src={videoSrc} title="YouTube video player" frameBorder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerPolicy="strict-origin-when-cross-origin" allowFullScreen />;
};

<Note>
  MCP integration is currently available only in the desktop Editor for Windows and macOS.
</Note>

You can connect the Rive Editor to AI tools through MCP (Model Context Protocol). The first set of tools are designed to let AI handle repetitive tasks, like creating complex View Models, State Machines with hundreds of states/layers, Layouts, Shapes, and more.

<YouTube id="_a2Y4vzuGAs" />

### Supported Features

* **Create and manage Rive files** — add, rename, resize, arrange, and focus artboards.
* **Inspect and edit the scene** — query hierarchies, select objects, update properties, rename, duplicate, reorder, reparent, or delete elements.
* **Build designs** — create shapes, paths, layouts, component instances, component lists, and asset-based elements.
* **Create animation and interaction** — edit linear animations, state machines, states, transitions, conditions, keyframes, and interpolation.
* **Work with data binding** — create view models, properties, instances, bindings, and custom property groups.
* **Edit scripts and shaders** — manage Luau scripts and WGSL shaders, update source code, run diagnostics, recompile, test, search code, and read console output.

<Info>
  This list of features will evolve over time as more tools are added.
</Info>

## Installation

### Using Cursor

<Steps>
  <Step title="Open Rive">
    Install and open the latest version of the [Rive](https://rive.app/downloads) desktop app for Mac or Windows.
  </Step>

  <Step title="Set up Cursor">
    Create a [Cursor](https://www.cursor.com/) account and install the app.
  </Step>

  <Step title="Open Cursor settings">
    Open Cursor and navigate to the settings panel in the top right corner.

    <img src="https://mintcdn.com/rive-transitions-2/pUWAhxU9qubdBvIR/images/editor/cursor-settings-button.png?fit=max&auto=format&n=pUWAhxU9qubdBvIR&q=85&s=5d054e2a502984a99fd916652d4fa32d" alt="Open cursor settings" width="1660" height="1090" data-path="images/editor/cursor-settings-button.png" />
  </Step>

  <Step title="Add custom MCP">
    Open the Tools & MCPs tab and click Add Custom MCP.

    <img src="https://mintcdn.com/rive-transitions-2/pUWAhxU9qubdBvIR/images/editor/cursor-mcp-settings.png?fit=max&auto=format&n=pUWAhxU9qubdBvIR&q=85&s=148bc56381d23d84adc824b15db55d76" alt="Open Cursor MCPs tab" width="1658" height="1080" data-path="images/editor/cursor-mcp-settings.png" />
  </Step>

  <Step title="Save the configuration">
    Save the following JSON snippet to your computer as `mcp.json`.

    ```json theme={null}
    {
      "mcpServers": {
          "rive": {
              "url": "http://127.0.0.1:9791/mcp"
          }
      }
    }
    ```
  </Step>

  <Step title="Enable connection">
    Turn the MCP connection `On`
  </Step>

  <Step title="Verify connection">
    If everything was installed correctly, you should see Rive as an available MCP server.

    <img src="https://mintcdn.com/rive-transitions-2/pUWAhxU9qubdBvIR/images/editor/cursor-mcp-connection.png?fit=max&auto=format&n=pUWAhxU9qubdBvIR&q=85&s=ec506b4b4b624fa3cbb59a9967cf3f83" alt="Cursor verified" width="1660" height="1104" data-path="images/editor/cursor-mcp-connection.png" />

    <Note>
      For the Rive server to be available, you must have the Rive Early Access app opened.
    </Note>
  </Step>
</Steps>

Additional information on setting up MCP can be found [here](https://docs.cursor.com/context/model-context-protocol).

### Using Claude in Terminal

<YouTube id="5_h51PdNhsU" />

<Steps>
  <Step title="Open Rive">
    Install and open the latest version of the [Rive desktop app](https://rive.app/downloads) for macOS or Windows.
  </Step>

  <Step title="Add the MCP server">
    Run the following command in your terminal:

    ```shell theme={null}
    claude mcp add --transport http rive http://127.0.0.1:9791/mcp
    ```
  </Step>

  <Step title="Start Claude">
    Run Claude and follow the prompts:

    ```shell theme={null}
    claude
    ```
  </Step>
</Steps>

## What can it do?

Once Cursor is installed and everything is set up correctly, it's time to start prompting the AI.

<Steps>
  <Step title="Open your Rive file">
    Have a Rive File open and an Artboard created.
  </Step>

  <Step title="Enter your prompt">
    Type your prompt into the chat UI and hit enter. The AI will take a moment to process the request.

    Example prompt:

    ```
    Create a State Machine about birds with 20 states and 2 layers
    ```
  </Step>

  <Step title="Complete the interaction">
    Once the request has been processed, type **End Prompt** to allow the AI to make changes to the Rive file.
  </Step>
</Steps>