Skip to main content

zeroheight connector for Figma Make

Lewis Smith-Tong
Lewis Smith-Tong
  • Updated
This feature is not available for Free or Starter plans. Want this and other premium features? Update your plan here.

Connect zeroheight to Figma Make so AI-generated prototypes reference your design system documentation. The connector gives Figma Make read access to your styleguides via MCP, so guidelines, components, and patterns are available as context while generating or refining designs.

This article covers setup for design system maintainers (Admins and Editors). If you're a design system consumer looking to connect Figma Make to a styleguide, ask your design system team for access. If you already have access to the remote MCP you can use it with Figma Make. Learn more.

Note: The remote MCP styleguide toggle has no effect on the zeroheight Figma Make partner connector. Once connected, Figma Make can access all styleguides in your zeroheight account.

Add the zeroheight partner connector

The zeroheight Figma Make partner connector can only be used by users who 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.

Optionally set each tool to Always run so Figma Make can use them without confirmation each time

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 — Browse accessible design systems
  • list-pages — Find pages within a styleguide
  • get-page — Retrieve a page's content, including usage notes and recommendations. Embedded content (e.g. Figma designs, Storybook) returns as a link.
  • get-page-images — Fetch images from a page as base64 content

Share access with your team

The partner connector is only available to Editors and Admins. Design system consumers (viewers) need to connect via a custom MCP connector using a the zeroheight remote MCP.

To enable your team:

  1. Enable remote MCP access for the styleguide (see Set up the remote MCP server)
  2. Point them to the Figma Make section of the Connect your AI tool to a zeroheight design system article for setup instructions

Publish a custom connector

You can also publish a custom connector so team members can connect using a single shared URL. Note that all users of a published custom connector connect via the URL configured during setup — activity will be associated with the user who generated that URL.

First you need to setup a personal custom connector:

  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 MCP 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.

Then you can publish your personal connector so anyone in your team can use it. Instructions from Figma here.

 

Share this article
Was this article helpful?