This article is for developers and designers connecting an AI tool — Claude, Cursor, VS Code, or similar — to a zeroheight design system.

You'll need an MCP URL from your design system team before you start. If you don't have one, ask your design system admin.

Figma Make

If you're a user with editor or admin access to zeroheight, you can use the zeroheight partner connector for Figma Make. Otherwise, follow the instructions below to use the zeroheight remote MCP server with Figma Make.

1. In Figma Make, click the + icon, choose Connectors, then Manage
2. Go to the Personal tab and click + Create connector
3. Give the connector a name — the name of your design system works well

4. Add a description. The description influences how Figma Make uses the connector. You can use this:

   This connector helps Figma Make work from your design system documentation, so prototypes stay on track from the start. Build testable proofs of concept faster using documented components, rules, and patterns — with this connector as the source of truth.

    

5. Click Next, paste your Raw URL into MCP server URL, and click Create
6. Click Connect next to your new connector
7. Optionally set each tool to Always run so Figma Make can use them without asking for confirmation each time.

Check out Figma's own documentation on custom connectors here.

Claude (claude.ai or Claude desktop)

1. Copy your URL from the Raw URL tab in the remote MCP details block or from styleguide settings
2. Go to Settings → Connectors and click Add custom connector
3. Enter a name and paste your remote MCP URL

VS Code with GitHub Copilot

1. Select the VS Code tab in the remote MCP details block
2. Click the icon next to the URL — VS Code MCP settings will open with the name and URL pre-populated
3. Click Install
4. Enable Agent Mode in GitHub Copilot Chat

Cursor

1. Select the Cursor tab in the remote MCP details block
2. Click the icon next to the URL — Cursor Tools and MCP settings will open with the name and URL pre-populated
3. Click Install

Claude Code / Codex

1. Select the Claude Code or Codex tab in the remote MCP details block
2. Copy the command
3. Open a terminal, paste and run the command

Microsoft Copilot Studio

1. Create an agent in Copilot Studio
2. In the agent's overview tab, set the model to GPT-5 or a Claude model — avoid GPT-4.1
3. Go to Tools and create a new tool
4. Choose Model Context Protocol from the modal
5. Enter your remote MCP URL — note that logging and access will be associated with the user who retrieved the URL
6. Select Connection, then Create new connection, then Add and configure
7. Go to Connection Settings and click Connect

v0

1. Click the + icon under the chat and choose MCPs
2. Click Add New
3. Choose Custom MCP 
4. Enter a name and paste your Raw URL

What you can ask

Once connected:

• "Search for pages about buttons"
• "What are the typography rules?"
• "Lint this code using the design system guidelines"
• Append the following to your prompt for the AI tool to create something "adhere to the design system guidelines accessible via the [MCP name] MCP"

Your MCP URL is a credential

Don't share your MCP URL — it grants read access to the styleguide on your behalf. If you think your URL has been compromised, contact your design system admin to reset MCP sessions.