Skip to main content

Using the remote zeroheight MCP server

Rab Rennie
Rab Rennie
  • Updated

Connect AI assistants to zeroheight styleguides using the Model Context Protocol.

This article covers installing and configuring the MCP server to work with Claude Desktop, VS Code, Cursor, and other MCP-compatible tools.

Check out this article to learn how to generate and share the MCP URL for your organisation.

What you'll need

Before you start:

  • A remote MCP server URL, it will look like https://mcp.zeroheight.com/mcp/...
  • One of: Claude Desktop, VS Code with GitHub Copilot, Cursor IDE, Windsurf IDE or another MCP client that works with remote MCP servers

Setup

Claude desktop

  1. Head to claude.ai or open Claude desktop
  2. Go to Settings → Connectors and click Add custom connector
  3. Enter a name and paste your remote MCP server URL
  4. Test the MCP connection by asking Claude a question about the styleguide

VS Code with GitHub Copilot

  1. Open the command palette - Shift + Command + P (Mac) / Ctrl + Shift + P (Windows/Linux)
  2. Search for MCP: Add Server
  3. For type choose HTTP
  4. Paste in the remote MCP server URL and enter a name when prompted
  5. Enable Agent Mode in GitHub Copilot Chat

Cursor IDE

  1. Open Cursor Settings → Tools & MCP
  2. Click New MCP Server or Add Custom MCP
  3. Update the mcp.json file to include the following and save
    (the name in this example is zeroheight but you can call it whatever you like, this is useful if you have multiple styleguides you want to refer to by name)

    {
      "mcpServers": {
        "zeroheight": {
          "url": "https://mcp.zeroheight.com/mcp/..."
        }
      }
    }

Usage

Once connected, you can ask questions about your styleguides:

  • "List my styleguides"
  • "Show pages about buttons"
  • "Get the navigation structure for [styleguide name]"
  • "Find typography documentation"
  • "What's on the colors page?"

The MCP server provides these tools:

  • list-styleguides: Browse all accessible styleguides
  • get-styleguide-tree: Get navigation hierarchy for a styleguide
  • list-pages: Find pages in a styleguide (with search)
  • get-page: Retrieve page content in Markdown or JSON

FAQs

How do I connect to multiple styleguides?

Each styleguide can be added as a separate server with a relevant name. You can either disable the ones you are not using in your client or specify which one should be used in your prompts
 

Share this article
Was this article helpful?