Connecting Miro's MCP Server to MCP-compatible clients

📘

This is a beta release of our MCP.

It is intended for evaluation and feedback purposes. The feature set and user experience may change in future releases. Feedback form.

This guide shows examples of how to connect to Miro's MCP Server based on the MCP-compatible client you are planning to work with. The Miro OAuth flow will be the same, but each tool may have a slightly different UI.

📘

The UI of each MCP-compatible client on this page may have changed recently, so please use this as a general guide. For the most accurate information, see the documentation of the MCP-compatible client of your choice.

❗️

If you are on Miro Enterprise Plan, you'll need to first enable Miro's MCP Server for your org before you can use it. See our Admin guide for more details.

Lovable

1. Log into lovable.dev.
2. Click on your profile in the top right.
3. Click on Settings -> Integrations. Scroll down to Your MCP Servers and find Miro. Click Set up.

4. Click on Connect and then follow the Miro OAuth flow to install Miro's MCP Server on the team of your choice. You'll only be able to use MCP on boards from the team you authorize.

🎉 That's it! You've now connected Miro's MCP Server to Lovable!

❤️ Now you can start using your content inside Miro to build prototypes in Lovable, just make sure to include the board you want to reference in your prompt!

✨You can prompt it something like "build me a landing page based on the content of this board: https://miro.com/app/board/uXjVGfoLbX0=/ (but add in your own Miro board URL).

Replit

📘

To use MCP with the Miro board in the video, use this template to bring that same Miro board into your account.

And the REPL from video above.

1. Click on button below to install Miro's MCP Server in Replit.

2. Click on Test & Save.

3. Click on Authorize with OAuth. This will start the OAuth flow to authenticate into your Miro account. Select the Miro Team where you want to use MCP. See Miro OAuth flow for MCP for more details.

4. Now you can start using your content inside Miro to build prototypes in Replit, just make sure to include the board ID you want to reference in your prompt!

Cursor

This example is with Cursor, but it should work the same or very similar in your AI tool of choice. The main difference will be where to add in the MCP configuration. The auth steps after that should be the same.

Go to Cursor settings -> Cursor Settings -> MCP -> Add a Custom MCP Server and add in the following JSON:

{
  "mcpServers": {
    "miro-mcp": {
      "url": "https://mcp.miro.com/", 
      "disabled": false,
      "autoApprove": []
    }
  }
}

Click on the authenticate button. This should open a new window for the Miro OAuth flow (see below). See OAuth details in previous guide.

You should see that the MCP Server is enabled and should see that tools and prompts are available, as shown below.

That's it! You're ready to start generating diagrams and next level apps with Miro MCP!

VSCode and GitHub Copilot

Watch the video below for details - written instructions also provided.

1. First, ensure that you have user MCP: User Configuration settings open the command palette with > and click on MCP: Open User Configuration. This should open a mcp.json file.
2. Next, from the same menu, use the MCP: Add Server command and then select "HTTP"
3. Enter in the URL: https://mcp.miro.com/
4. Select either Global or Workspace
5. Open the Miro OAuth flow, install the app on the team of your choice.
6. Use /to start a prompt. You should see Miro MCP's prompts there, such as code_create_from_board and add in a board URL like https://miro.com/app/board/uX1234567/ and hit enter. You can also use code_explain_on_board or any other tools & prompts available to you.
7. That's it! Happy coding!

Claude Code

Watch the video below to see how to use Miro's MCP Server with Claude Code.

1. Login to Claude Code with claude command.
2. Next, use claude mcp add --transport http miro https://mcp.miro.com to add the Miro MCP into Claude Code.
3. From there, you can use Miro MCP prompts by running: /miro-mcp:code_explain_on_board

Gemini CLI

Watch the video below:

Windsurf

1. Go to Windsurf settings -> Windsurf Settings -> Cascade -> Manage MCPs -> Configure and then add in the following JSON:

{
  "mcpServers": {
    "miro-mcp": {
      "url": "https://mcp.miro.com/", 
      "disabled": false,
      "autoApprove": []
    }
  }
}

2. Go through the Miro OAuth flow and add the MCP app on the team of your choice.
3. Start prompting Windsurf to use Miro MCP, we recommend code_create_from_boardadd in a board URL like https://miro.com/app/board/uX1234567/ and hit enter.