Skip to content
Open
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
32 changes: 18 additions & 14 deletions app/en/guides/tool-calling/mcp-clients/claude-desktop/page.mdx
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
```mdx
import { Steps, Callout } from "nextra/components";
import { SignupLink } from "@/app/_components/analytics";
import Image from "next/image";
Expand Down Expand Up @@ -32,20 +33,22 @@ export const STEP_7_DARK_HEIGHT = 2458;
export const STEP_7_LIGHT_WIDTH = 1848;
export const STEP_7_LIGHT_HEIGHT = 2450;

<!-- Editorial: Headings section - Changed to sentence case; Arcade Terminology section - Corrected "MCP Gateway" to "MCP gateway" -->

# Use Arcade in Claude Desktop

<GuideOverview>
<GuideOverview.Outcomes>

Connect Claude Desktop to an Arcade MCP Gateway.
Connect Claude Desktop to an Arcade MCP gateway.

</GuideOverview.Outcomes>

<GuideOverview.Prerequisites>

1. Create an <SignupLink linkLocation="docs:claude-desktop-client">Arcade account</SignupLink>
2. Get an [Arcade API key](/get-started/setup/api-keys)
3. Create an [Arcade MCP Gateway](/guides/create-tools/mcp-gateways) and select the tools you want to use
3. Create an [Arcade MCP gateway](/guides/create-tools/mcp-gateways) and select the tools you want to use

</GuideOverview.Prerequisites>

Expand All @@ -61,7 +64,7 @@ Connect Claude Desktop to an Arcade MCP Gateway.

### Go to your Claude Desktop setting page

On the bottom left corner of Claude Desktop, click on your user avatar to open the settings menu, then click on the "Settings" button.
On the bottom left corner of Claude Desktop, click your user avatar to open the settings menu, then click the "Settings" button.

<Image
alt={"Step 1: Click on the settings icon on Claude Desktop"}
Expand All @@ -78,9 +81,9 @@ On the bottom left corner of Claude Desktop, click on your user avatar to open t
height={STEP_1_DARK_HEIGHT / IMAGE_SCALE_FACTOR}
/>

### Add a Custom Connector
### Add a custom connector

On the settings page, click on the "Connectors" tab, and then on the "Add custom Connector" button.
On the settings page, click the "Connectors" tab, and then on the "Add custom Connector" button.

<Image
alt={"Step 2: Add a custom connector"}
Expand All @@ -97,7 +100,7 @@ On the settings page, click on the "Connectors" tab, and then on the "Add custom
height={STEP_2_DARK_HEIGHT / IMAGE_SCALE_FACTOR}
/>

A modal dialog will open asking you for a name and a URL. Enter a name for your connector, and the URL of your MCP Gateway. Then, click on the "Add" button.
A modal dialog will open asking you for a name and a URL. Enter a name for your connector, and the URL of your MCP gateway. Then, click the "Add" button.

<Image
alt={"Step 3: Enter a name and URL for your connector"}
Expand All @@ -114,9 +117,9 @@ A modal dialog will open asking you for a name and a URL. Enter a name for your
height={STEP_3_DARK_HEIGHT / IMAGE_SCALE_FACTOR}
/>

### authenticate with your Arcade account
### Authenticate with your Arcade account

You will see a new connector added to your list of connectors. Click on the "Connect" button to authenticate with your Arcade account.
You will see a new connector added to your list of connectors. Click the "Connect" button to authenticate with your Arcade account.

<Image
alt={"Step 4: Authenticate with your Arcade account"}
Expand All @@ -133,7 +136,7 @@ You will see a new connector added to your list of connectors. Click on the "Con
height={STEP_4_DARK_HEIGHT / IMAGE_SCALE_FACTOR}
/>

Your browser will open a new tab to authenticate with your Arcade account. Check that the URL matches the one in the modal dialog, and then click on the "Allow" button.
Your browser will open a new tab to authenticate with your Arcade account. Check that the URL matches the one in the modal dialog, and then click the "Allow" button.

<Image
alt={"Step 5: Allow authentication with your Arcade account"}
Expand All @@ -150,9 +153,9 @@ Your browser will open a new tab to authenticate with your Arcade account. Check
height={STEP_5_DARK_HEIGHT / IMAGE_SCALE_FACTOR}
/>

### Configure the MCP Gateway
### Configure the MCP gateway

Now Claude Desktop is connected to your MCP Gateway, it's a good time to configure the MCP Gateway to your needs. Click on the "Configure" button to open the configuration dialog.
Now Claude Desktop connects to your MCP gateway, it's a good time to configure the MCP gateway to your needs. Click the "Configure" button to open the configuration dialog.

<Image
alt={"Step 6: Configure the MCP Gateway"}
Expand All @@ -169,7 +172,7 @@ Now Claude Desktop is connected to your MCP Gateway, it's a good time to configu
height={STEP_6_DARK_HEIGHT / IMAGE_SCALE_FACTOR}
/>

In this configuration pane, you can configure which tools are available to Claude Desktop, and whether or not they require human confirmation. On this example MCP gateway, we require human confirmation for all tools that may have destructive actions, or actions with potentially undesired consequences.
In this configuration pane, you can configure which tools are available to Claude Desktop, and whether or not they require human confirmation. On this example MCP gateway, confirmation is required for all tools that may have destructive actions, or actions with potentially undesired consequences.

<Image
alt={"Step 7: Configure the MCP Gateway"}
Expand All @@ -186,8 +189,9 @@ In this configuration pane, you can configure which tools are available to Claud
height={STEP_7_DARK_HEIGHT / IMAGE_SCALE_FACTOR}
/>

### Try it out!
### Try it out

You can now open a new chat within Claude Desktop. Ensure that your connector is enabled, and the ask the agent to use a tool!
You can now open a new chat within Claude Desktop. Ensure that your connector works, and the ask the agent to use a tool.

</Steps>
```