# Claude connectors: what they are and how to add one

[Canonical HTML page](https://gradiently.design/guide/claude-connectors)

A connector gives Claude hands: it can search your files, read a project or make a design in a real tool, rather than describing how you might. Here is how they work and how to add one in a few minutes.

## The short version

- Claude connectors link Claude to outside services so it can search, read and act in them during a conversation.
- Connectors are built on the Model Context Protocol, an open standard for connecting AI assistants to tools and data.
- Remote connectors run on the web and are added by URL or from a directory, while local servers run on your own computer.
- Claude asks for permission before using a connector's tools, and you can allow an action once or always.
- Which connector features you can use depends on your Claude plan and, in organisations, on what an owner has enabled.

**Claude connectors** link Claude to outside services so that, during a chat, it can search them, read from them and take actions in them, such as creating a document or a design. Each connector is an MCP server: a small web service that speaks the open Model Context Protocol and tells Claude which tools it offers. You add one from Claude's connector directory or, for a custom connector, by pasting the server's URL in Claude's settings, then sign in to the service and choose what Claude may do there.

## How connectors work

When a connector is enabled, Claude receives a list of its tools, each with a name, a description and the inputs it needs. When your request fits one, Claude fills in the inputs and asks your permission to run it. The service does the work and sends back a result, which Claude reads and uses in its reply. The specification and a list of example servers live at [modelcontextprotocol.io](https://modelcontextprotocol.io), and [what is MCP](https://gradiently.design/guide/what-is-mcp) explains the idea in plain words.

| Type | Where it runs | How you add it | Typical use |
| --- | --- | --- | --- |
| Directory connector | On the service's servers | Pick it from Claude's list and sign in | Popular apps and file stores |
| Custom remote connector | On the web, at a URL | Paste the server URL in settings | Any service with an MCP server |
| Local server | On your own computer | A desktop extension or a config file | Files and apps on your machine |
| Claude Code server | Local or remote | `claude mcp add` in the terminal | Development and automation |

Four ways Claude connects to tools. Remote connectors are the easiest to share and keep up to date.

## How to add a connector from the directory

1. **Open connector settings** In Claude on the web or the desktop app, open Settings and find Connectors.
2. **Browse the directory** Pick the service you want. Each listing explains what the connector can access.
3. **Connect and sign in** Claude sends you to the service to sign in and approve access, then returns you to Claude.
4. **Enable it in a chat** In a conversation, turn the connector on from the tools menu. Leave unused connectors off so Claude chooses from fewer tools.

## How to add a custom connector

A custom connector is any remote MCP server that isn't in the directory, including ones from smaller tools or your own company. In Settings, under Connectors, choose to add a custom connector, give it a name and paste the server's URL. If the server uses sign in, Claude walks you through it. On Team and Enterprise plans, an owner may need to add or allow the connector for the organisation first. Anthropic's Claude help centre has the current steps for each plan, and it is worth checking, because the menus change.

> **Some servers use API keys** Not every server signs in through a browser. Some expect an API key sent in an Authorization header. If your Claude app's connector form has nowhere to put one, use Claude Code, or follow the service's own setup guide.

## Adding an MCP server in Claude Code

Claude Code adds servers from the terminal, and it can send a custom header, which makes it the simplest route for servers that use API keys. Keep the key in an environment variable so it never sits in your shell history or a shared file.

```bash
# A remote server that signs in through the browser
claude mcp add --transport http example https://example.com/mcp

# A remote server that expects an API key
claude mcp add --transport http gradiently https://gradiently.design/api/mcp \
  --header "Authorization: Bearer $GRADIENTLY_API_KEY"

# Check what is connected
claude mcp list
```

Adding remote servers to Claude Code. Replace the example URL with the server you want.

## An example: Claude making designs

Design shows what a connector changes. On its own, Claude can suggest a headline and describe a layout. Connected to Gradiently, it can search Marks, read your brand and create designs that open in the Studio, ready for you to check and export. A workspace owner or admin creates a scoped API key in Gradiently under Settings › API and agents, choosing exactly what the assistant may do, and the [developer docs](https://gradiently.design/developers/mcp) cover setup. Designs the assistant makes this way spend no Gradiently credits.

A vertical Instagram Story announcing late opening on Fridays, open until midnight with the kitchen until eleven

A story Claude made from one sentence through a design connector: real text, the brand's Mark, the exact 1080×1920 frame.

[Designing with Claude through Gradiently](https://gradiently.design/guide/design-with-claude) walks through a full conversation, from one story to three formats.

## Keeping connectors safe

### Avoid

- Custom connectors from sources you can't verify
- Choosing "always allow" for actions that delete or spend
- One key with every permission, shared everywhere
- Leaving every connector on in every chat

### Do

- Servers published by the service itself
- Allow once until you trust a tool's behaviour
- One scoped key per place, named after it
- Enable only the connectors a chat needs

A connector can read what Claude sends it and act with the access you granted. Content a connector fetches, such as a web page or a shared file, can also contain instructions, so read what Claude proposes to do next rather than approving on autopilot.

## Troubleshooting a connector

| Symptom | Likely cause | Try |
| --- | --- | --- |
| Connector added, no tools appear | Not enabled in this chat | Turn it on from the tools menu |
| Unauthorised or 401 error | Missing or revoked key or sign in | Reconnect, or create a new key |
| Claude ignores the connector | Request doesn't match a tool | Name the service and the outcome in your message |
| Option to add custom connectors missing | Plan or organisation settings | Ask your Claude organisation owner, or check the help centre |

Four common problems when adding a connector.

ChatGPT has a similar system, described in [ChatGPT apps](https://gradiently.design/guide/chatgpt-apps), [connecting an AI assistant](https://gradiently.design/guide/connect-ai-assistant) covers Gradiently in several clients, and [MCP servers for designers](https://gradiently.design/guide/mcp-servers-for-designers) suggests which kinds to connect first.

## FAQ

### What are Claude connectors?

Integrations that let Claude search, read and act in outside services during a chat. Each one is an MCP server that offers Claude a set of tools.

### How do I add a custom connector to Claude?

Open Settings, go to Connectors, choose to add a custom connector and paste the remote MCP server's URL, then sign in if asked. Some plans need an owner to allow it first.

### What is the difference between a local and a remote MCP server?

A local server runs on your computer and can reach your files and apps. A remote server runs on the web at a URL, so it works from any device.

### Can Claude make designs with a connector?

Yes, with a design tool that offers an MCP server. Gradiently lets Claude create designs in your brand that open in its Studio for editing.