This feature is not available on Free or Starter plans. Want this and other premium features? Update your plan here.

The zeroheight connector for Figma Make allows teams to bring design system documentation directly into Figma’s AI-powered workflows. It connects Figma Make to zeroheight via MCP (Model Context Protocol), so designers can reference trusted guidance, components, and standards while generating or refining designs.

The MCP styleguide setting has no effect on the zeroheight Figma Make connector. Once connected, Figma Make can access all styleguides and pages in your zeroheight account.

Adding the zeroheight connector

Access to MCP is currently limited to organizations on the zeroheight Enterprise plan. If your team is not on Enterprise, you will not be able to add the zeroheight connector.

Design system team members

The zeroheight Figma Make partner connector can only be used by people who actively maintain the design system in zeroheight. To use the partner connector you must have access to a zeroheight account on the Enterprise plan and have an Editor or Admin seat.

To add the zeroheight connector, click the + icon in Figma Make, choose Connectors then Manage.

Then click Connect next to the option for zeroheight.

A tab will open in your browser where you'll need to login to zeroheight and authorise Figma Make to access the MCP.

Click Approve and return to Figma Make. After a second or two you'll see details about the connection and the available tools.

To speed things up later you can set each tool to Always run.

This means that later, when you invoke the connector, Figma Make can use the tools without your confirmation.

Design system viewers/consumers

Figma Make custom MCP connector

The zeroheight partner connector for Figma Make is not available to documentation viewers. However, viewers can access the zeroheight MCP in Figma Make using a custom MCP connector.

Work with your design system team to get access to the zeroheight MCP.

Click the + icon in Figma Make, choose Connectors then Manage. Navigate to the Personal tab and click + Create connector.

Give the connector a name (e.g. "zeroheight" or the name of your design system), an icon and a description. The description is important since it influences how Figma Make uses the connector. Here's a description you can use:

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.

Click Next then, copy/paste your unique zeroheight MCP URL into MCP server URL and click Create.

Then click Connect next to the newly created custom connector. After a second or two you'll see details about the connection and the available tools. To speed things up later you can set each tool to Always run. This means that later, when you invoke the connector, Figma Make can use the tools without your confirmation.

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

Publish your custom connector

You can also enable other users to use your custom connector by publishing it. Instructions from Figma here.

Note, this means all users of the published custom connector will be connecting via the unique URL configured during setup.

Using the zeroheight connector

Once added you can either invoke the connector via the + icon in Figma Make. Click Connectors then select the zeroheight connector or by typing @ into the prompt and selecting the zeroheight connector:

Once you've connected the zeroheight connector to Figma Make, you can ask that Figma Make ensures the prototypes it makes adhere to your guidelines in zeroheight. For example you could prompt Figma make with "Create me a checkout page that adheres to the guidelines in @zeroheight".

The connector server provides these tools:

• list-styleguides: Discover available design systems that provide documented guidance for components, patterns, and styles. If multiple systems are available, confirm with the user which should be used.
• get-styleguide-tree: View the navigation hierarchy of a design system — including categories, pages, and tabs — to better understand how guidance is organized.
• list-pages: Explore the pages within a design system to find guidance relevant to the task.
• get-page: Fetch guidance from a specific design system page, including usage notes, recommendations, and supporting context.