Skip to main contentCarbon Design System

Carbon MCP

Follow these steps to configure your AI application or AI agent to use Carbon MCP.

Step 1: Using your IBMid (w3id) or functional ID

When going through the OAuth onboarding process, you will need to authenticate with your IBMid (w3id for IBMers). If you need an IBMid, create one here.

IBM product teams also have the option of authenticating via a functional ID. If your team needs a functional ID, create one here.

Step 2: Getting access credentials

This step will launch the authorization flow to generate Carbon MCP authentication credentials, which can be provided to your MCP client.

IBMers will be provided authentication credentials immediately upon clicking the link below and signing in. All other users will be prompted to request access.

Access request workflow

  1. Visit this link to generate your token and session ID

  2. Request access if prompted
  3. Check your email for the activation link
  4. Copy your credentials: to add to your Carbon MCP configuration

Step 3: Connecting to IBM Bob and other MCP clients

The IBM Cloud deployment of the Carbon MCP is available at

https://mcp.carbondesignsystem.com/mcp
.

Here’s how to set it up in Bob and other common MCP clients:

  • There are two steps required to set up Carbon MCP in Bob. First, you need to install Carbon MCP from the Bob Marketplace. Then, you need to install the Carbon React mode from the Bob Marketplace.

    Step 1: Installing Carbon MCP


    In Bob, select the settings icon in the upper right.


    Bob Settings

    Select the MCP tab, then search for “Carbon” in the text field. Click the Install button.


    Bob Marketplace Carbon MCP

    Enter your Carbon access token and session ID in the modal dialogue, then click Install.


    It is not recommended to choose “Project (current workspace)” as it can potentially introduce the risk of your token being committed to your repository.


    Install Carbon MCP

    You will see a confirmation of a successful installation.


    Carbon MCP successfully installed

    You’ve successfully installed Carbon MCP, and now you need to install the matching Carbon React mode from the Bob Marketplace using the guidance below.

    Step 2: Installing Carbon React Mode


    In Bob’s settings, now select the Modes tab, then search for “Carbon React” in the text entry field. Click the Install button.


    Bob Marketplace Carbon MCP

    Select the installation scope in the modal dialog, then click Install.


    Carbon React mode scope

    You will see a confirmation of successful installation.


    Carbon React mode installed

    Select the Carbon React mode at the bottom left of the UI, to use it in the current Bob session.


    Carbon React mode active

    • Use the Claude Code CLI and replace the
      <TOKEN>
      and
      <SESSION>
      with your Carbon MCP auth credentials

    claude mcp add-json carbon-mcp '{"type":"http","url":"https://mcp.carbondesignsystem.com/mcp","headers":{"Authorization":"Bearer <TOKEN>","X-MCP-Session":"<SESSION>"}}'

    • Verify that Claude Code recognizes Carbon MCP by running
      claude mcp list
  • Carbon MCP can be set up in Claude Desktop as an Extension or Custom Connector. This section describes how to make both connections.

    Adding Carbon MCP as an Extension

    • Open Settings > Extensions
    • Click on Advanced settings
    • Click Install Extension
    • Install the
      Carbon MCP Claude Desktop extension
      , which can be downloaded here.
    • Enter your Carbon MCP auth token and session ID in the modal
    • Click Save and Enable

    Carbon MCP Claude Desktop extension

    • You will see Carbon MCP configured under installed extensions

    Carbon MCP Claude extension installed

    Adding Carbon MCP as a Custom Connector

    • Open Settings > Connectors
    • Click on Add Custom Connector
    • When prompted for a name, enter
      carbon-mcp
    • Under the Remote MCP server URL input, use
      https://mcp.carbondesignsystem.com/mcp
    • Click Add
  • Install MCP Server
    • Or manually open the command palette
    • Select “View: Open MCP Settings”
    • Click on “Add custom MCP”
    • It will open a file with your MCP servers where you can add the following configuration:

    { "mcpServers": { "carbon-mcp": { "type":"streamable-http", "url":
    "https://mcp.carbondesignsystem.com/mcp", "disabled": false, "timeout": 600,
    "headers": { "Authorization": "Bearer <TOKEN>", "X-MCP-Session": "<SESSION>" },
    "alwaysAllow": ["code_search", "docs_search"] } } }


    • Replace
      <TOKEN>
      and
      <SESSION>
      with your actual Carbon MCP auth credentials
    • Save and close the file
    • Quit and relaunch Cursor
  • Install in VS Code
    • Or use VS Code CLI and replace the
      <TOKEN>
      and
      <SESSION>
      with your Carbon MCP auth credentials

    code --add-mcp '{"name":"carbon-mcp","type":"http","url":"https://mcp.carbondesignsystem.com/mcp","headers":{"Authorization":"Bearer <TOKEN>","X-MCP-Session":"<SESSION>"}}'

  • If the MCP client you are using is not listed, refer to their documentation for

    remote servers
    and use
    https://mcp.carbondesignsystem.com/mcp
    as the URL.

Additionally, an

llms.txt
file is available here — a structured index of Carbon Design System documentation, components, and source repositories for AI tools and LLMs.

Step 4: Adding the client system prompt

Some MCP clients let you set a Carbon MCP system prompt. When available, enable it to get the best results from Carbon MCP.

Here is a summary of Carbon MCP system prompt support in Bob and other common MCP clients:

MCP ClientSystem Prompt SupportNotes
BobN/ASystem prompt predefined in the Carbon React mode
Claude CodeYesWorkspace and project-level rules supported
Claude DesktopYesPer-chat and per-agent system prompts supported
CursorYesPersistent workspace instructions and rules
GitHub Coding AgentNoUses internal non-editable system prompts
VS CodeNoNo system prompt configuration available

Carbon MCP client system prompt

Use the system prompt in your MCP client to get the maximum benefit from Carbon MCP.

When considering Bob, the client system prompt has been predefined as the “Carbon React” mode in the Bob Marketplace.

## Mission
You are a highly skilled AI engineer specializing in Carbon Design System. Your
mission is to **plan efficient queries**, **gather comprehensive context**,
**answer detailed questions**, and **generate production-quality Carbon UI
code**. You have two MCP tools:
- `code_search` → fetch **component examples**, **variants**, **props**, and
Storybook links (Carbon Core + Carbon for IBM Products) **and AI Chat code

System prompt configuration examples: Claude and Cursor

  • Add a

    systemPrompt
    field to your Carbon MCP server Claude Code configuration and Claude Desktop configuration. Insert it anywhere within the carbon-mcp object (recommended placement is after the url field for readability).


    { "mcpServers": { "carbon-mcp": { "type":"streamable-http", "url":
    "https://mcp.carbondesignsystem.com/mcp", "disabled": false, "timeout": 600,
    "headers": { "Authorization": "Bearer <TOKEN>", "X-MCP-Session": "<SESSION>" },
    "alwaysAllow": ["code_search", "docs_search"] } } }


    • Replace
      CARBON_MCP_SYSTEM_PROMPT
      with the system prompt provided earlier in this page
    • Replace
      <TOKEN>
      and
      <SESSION>
      with your actual Carbon MCP auth credentials
    • Download a Claude JSON template with the
      systemPrompt
      attribute

      here

    Configuration file location for Claude Desktop (macOS):

    ~/Library/Application Support/Claude/claude_desktop_config.json

    Configuration file location for Claude Code (macOS):

    ~/.config/claude-code/config.json

  • Cursor uses

    Workspace Rules
    as its system prompt equivalent. These rules act as persistent instructions that Cursor sends to the model before each request.

    Add Carbon MCP system prompt to Cursor:

    • Open your project in Cursor
    • Click Settings
    • Click Rules and Memories
    • Scroll in the dialogue to User Rules and Click Add Rule
    • Paste the Carbon MCP system prompt into the
      Workspace Rules
      editor
    • Save the rule to apply it as a system prompt for the workspace