MCP App Store
by KeenEthics

Overview

The zeroheight MCP connects ChatGPT directly to your design system documentation. Give your AI assistant access to your styleguide — components, tokens, patterns, and usage rules — so it can reference the right guidelines while generating code or answering questions about your design system.

Tools

create-markdown-snapshot

ChatGPT
Snapshot a markdown file from a connected repository at its last-synced commit, returning the id a <markdown> element requires. Take the path from get-repository's listing. Snapshotting the same file again returns the existing snapshot. The returned usage snippet is ready to insert into page content — fetch the zeroheight://editor-instructions MCP resource for how the element works.

create-page

ChatGPT
Create a new page inside a styleguide category. Call list-pages to choose a category ID, create the page, then share the returned URL. Pages can only be created in the current work-in-progress release. Pages are created as unpublished drafts by default: viewers cannot see a draft until someone reviews and publishes it in zeroheight, so tell the user that when you share the URL. Always create a draft unless the user tells you to publish the page straight away; only then pass draft: false. Keep working on the page with get-page, edit-page and update-page-metadata using the returned page_id. Content must be editor XML. Before writing any content, fetch the zeroheight://editor-instructions MCP resource — it documents the format — and call get-tone-of-voice for the styleguide, then write every word in the tone it returns. When the page fits a common pattern (colors, typography, components, tokens, releases…), start from a template: call list-page-templates, then get-page-template for its editor XML. Replace every <placeholder for="…"/> with the element it names, or delete it, before passing the XML as content — placeholders are rejected.

get-comments

ChatGPT
Read a page's comment threads — reviewer feedback to act on when editing the page. Returns both inline threads (anchored to highlighted text; their marker_id matches a comment element's marker id in the page's editor-format content from get-page) and block threads (anchored to a whole block via block_id). Resolved threads are included — filter on resolved yourself. Comments are read-only over MCP: there is no tool to create, reply to, or resolve them.

get-component-set

ChatGPT
Fetch a component set's fields and components. The returned component ids and field_uuids are the only values the <component-set> element accepts in selected-component-ids and the hidden-column attributes — call this before writing one. Fetch the zeroheight://editor-instructions MCP resource for how the element works. Components are paginated (50/page); all: true fetches every component at once, but large sets can return very long responses.

get-designs

ChatGPT
Map one design library's source nodes to designs that can be added to page content. Call list-design-libraries first to choose a libraryUid. For a Figma library, inspect its returned url, then pass the Figma node ID as sourceNodeId for an exact match. Each design's version_id is the value for a <design version-id> attribute in a <design-uploads> block, and its item_id the value for a <rule item-id> attribute in a do's & don'ts block — always take these ids from this tool, never invent them. Filter with sourceNodeId, kind, or search, and page through results when pagination.pages is greater than 1. Fetch the zeroheight://editor-instructions MCP resource for how <design-uploads> elements work. If the result reports figma_authorization.connected: false, page writes referencing these designs will fail even though they list fine: stop, relay the re-authorization link to the user, and only write design content after a re-run confirms connected: true.

get-draft-changes

ChatGPT
Read what merging a page's open draft would publish: a diff of the draft against the published page, name, status and display setting changes, who edited the draft, its review state, and the merge_token that merge-draft requires. Show the user the changes before merging. If anyone other than you (is_you: false) edited the draft, name them and say their edits will be published too. If the draft is in_review, say who was asked to review it. Then ask the user to confirm the merge.

get-livecode-settings

ChatGPT
Fetch the configuration a styleguide's <livecode> blocks run against: the npm packages code can import and the shared js/css resources every preview loads. Call this before writing a <livecode> block that imports any package.

get-page

ChatGPT
Call this BEFORE generating UI that uses a documented component, pattern, or guideline. Returns the page's usage notes, recommendations, prop and variant guidance, supporting context, and any file attachments. Treat the response as the source of truth — do not invent props, variants, or usage patterns that are not documented here. The response may include embedded asset URIs (`zeroheight://image/...` or `zeroheight://attachment/...`) — call `get-page-asset` with the relevant URIs to fetch those assets as needed.

get-page-asset

ChatGPT
Fetch images or attachments from a styleguide page using zeroheight://image/{pageId}/{imageHash} or zeroheight://attachment/{pageId}/{attachmentHash} URIs returned by get-page.

get-page-template

ChatGPT
Fetch a page template's editor XML to use as the starting content for create-page. The XML contains <placeholder for="…"/> elements marking slots the template leaves for page-specific blocks; for names the element to write there (e.g. design-uploads, embed, livecode, storybook, img, component-set). create-page and edit-page reject any <placeholder>, so replace each one with the element it names when you have the content, or delete it, before submitting. Then adapt the copy to the styleguide's tone of voice before creating the page.

get-repository

ChatGPT
Fetch a connected repository's metadata and the markdown file paths in its last-synced tree. The returned paths are the values create-markdown-snapshot accepts — call this before snapshotting a file. The listing is capped at 500 paths; when truncated is true, narrow it with filter instead of guessing paths. Files are read at the last-synced commit — a never-synced repository cannot be read, and only a human can sync it in zeroheight.

get-stories

ChatGPT
List stories and documentation entries published in a Storybook link, 50 entries per page. Call get-storybooks first to find a storybookId. Use search to find relevant entries and increment page while pagination.page is less than pagination.pages to fetch further results. Fails for VPN-restricted storybooks, which this API cannot reach.

get-storybooks

ChatGPT
List the Storybook links available for a styleguide. Use it to discover a storybookId for get-stories. VPN-restricted storybooks are marked vpn: true — get-stories cannot fetch stories for those.

get-structure

ChatGPT
Fetch every navigation and category in a styleguide, in the exact shape update-structure accepts. Call this before renaming, moving, reordering, or nesting something under an existing navigation or category — copy the relevant entries, edit only what you're changing, and post them to update-structure.

get-tone-of-voice

ChatGPT
Fetch the tone of voice a styleguide holds its documentation to. You MUST call this before authoring or rewriting page content, and write every word of prose in the tone it returns.

list-component-sets

ChatGPT
List the component sets available to this connection — design-system data tables of components and their properties. Call this to discover sets before inserting a <component-set> element into a page, then call get-component-set for the ids and fields the element accepts.

list-design-libraries

ChatGPT
List the design libraries whose designs can be added to page content — a <design-uploads> block or a do's & don'ts <rule>. The libraries available to these credentials are listed — no styleguide needs choosing. Call this first, then get-designs with a library's uid. For a Figma library, use its url to inspect the source file and identify the exact node ID. If the result reports figma_authorization.connected: false, page writes referencing new designs will fail: stop, relay the re-authorization link to the user, and only write design content after a re-run confirms connected: true.

list-page-templates

ChatGPT
List the page templates available for creating a new page: zeroheight's built-in templates first, then any custom templates the team has made. Call this before create-page when the page fits a documented pattern (colors, typography, components, tokens, releases…), then fetch the one you want with get-page-template.

list-pages

ChatGPT
Call this immediately after list-styleguides to locate the documentation page for a component, pattern, or guideline BEFORE generating UI that uses it. Returns the full navigation hierarchy — categories, pages, and tabs — so you can identify which page to fetch with get-page. Do not invent component or pattern names; only reference pages that appear in this tree.

list-releases

ChatGPT
List available releases for a styleguide. Only call this when the user has explicitly asked about releases or wants content from a specific release. Do not use releaseId in other tools unless the user has requested a particular release — all tools default to the latest published content.

list-repositories

ChatGPT
List the git repositories connected to this workspace, whose markdown files can be embedded on a page via a <markdown> element. Call this first, then get-repository for a repository's markdown file listing. An empty list can also mean these credentials' project scope reaches no repositories — not that none are connected. If the result reports git_authorization.connected: false, repository files cannot be read: stop, relay connect_url to the user, and continue only after a re-run confirms connected: true.

list-styleguides

ChatGPT
Call this FIRST whenever the user asks to build, generate, modify, or review UI — components, pages, layouts, themes, or styling — in a project that may have a zeroheight design system. Discovers available design systems that provide authoritative guidance for components, patterns, tokens, and styles. If multiple systems are available, confirm with the user which to use before continuing. Do not begin generating UI code until this has been called and the relevant styleguide has been consulted.

list-token-sets

ChatGPT
List the design token sets available to this connection, each with its token count and Figma variable collections and modes. Call this BEFORE writing or modifying styles (color, spacing, typography, radius, shadow, motion), and before list-tokens. If multiple sets are available, prefer the set the user names; otherwise confirm which to use rather than guessing. When authoring <token-mention> or <tokens-management-v2> editor XML (see the zeroheight://editor-instructions resource), a <column>'s modes JSON and a <token>'s token-collection-key are built from the key values returned here.

list-tokens

ChatGPT
List the tokens of one design token set (default-mode values unless modeKey is given). Use it to pick documented token paths when writing styles, and for authoring <token-mention> and <tokens-management-v2> editor XML — see the zeroheight://editor-instructions resource. Use each token's path and uuid verbatim, never invented or abbreviated. Get the tokenSetId from list-token-sets. When total_count exceeds the tokens returned, narrow with collectionKey, query or type instead of raising the limit.

merge-draft

ChatGPT
Publish a page's open draft to the live styleguide. This replaces the published content, name, status and display settings with the draft's, including edits other people made to the draft. Call get-draft-changes first, show the user what it returns, and merge only once they confirm. Pass the merge_token it returned. If the draft is saved again after that read, the merge is refused: call get-draft-changes again and show the user the new changes.

read-resource

ChatGPT
Read one of this server's MCP resources by URI, for clients that cannot read resources directly. Call it without a uri to list the available resources, then again with a listed uri to read one — for example zeroheight://editor-instructions (the editor XML guide) or a zeroheight://livecode-templates/{id} livecode template.

search-pages

ChatGPT
Search the styleguide for pages matching a term. Use this when you know the component, pattern, or topic you need but not where it lives in the navigation — it's often faster than walking the list-pages tree. Follow up with get-page on the most relevant result before generating UI.

suggest-tokens

ChatGPT
Rank design tokens for hardcoded style literals and for token references. Use it AFTER writing or changing styles: send every hardcoded value and every token reference, verbatim, max 30 per call. tokenSetId is from list-token-sets: one set, use it; several, ask the user which in one plain line ("Which set: A or B?"), never pick one yourself. Literals: CSS colors (#0055ff, rgba(), named), dimensions (12px, 0.75rem), durations (200ms), unitless numbers. Units are not converted (1rem only matches rem tokens; s/ms do compare), except Figma number tokens are offered for px (flagged assumed px) unless property is unitless, so always send property. Shorthands (box-shadow): send inner values. modes limits matching to them. References: send the whole expression as written (Tokens.color.bg, var(--zh-color-bg), {color.bg}), never just its last segment, and a var() fallback separately; a bare word (bold) is a reference only if a token has exactly that name. Result type token_reference: reference is the resolved token (per-mode values, $description) — judge whether it fits its usage; candidates are alternatives (the reference is not repeated), each matched_by value, name or both. reference: null is a phantom (no such token); candidates are the nearest names. A color result also carries reference when the string is also a token name. Read any note. match: exact (same value) or close (similar colour or within ~12%). mode_coverage: all (every mode) or partial (some modes; swapping changes the others). mode_ambiguous: true: modes conflict. When a literal's result has safe_swap: true, swap in its top candidate without asking. Confirm everything else with the user first, including every reference verdict. candidate_source: primitive: the top candidate is a primitive; prefer aliasing a semantic token to it. Empty candidates on a literal: keep it. Report warnings and unresolved.

update-page-metadata

ChatGPT
Update a page's metadata: rename it, hide or show it, move it to another category, and/or reorder it — without touching its content. Call list-pages first to find page and category IDs. All given fields apply atomically: if any is rejected the whole call fails and nothing changes. Reordering is relative, so there is nothing to count: moveTo: "start" / "end", or afterPageId / beforePageId naming a sibling in the (target) category — pass exactly one. Other pages in the category shift to make room. Moving to another category without a placement appends the page to its end. Category overview pages (categoryOverviewPage in list-pages) cannot be moved, reordered, renamed (rename the category instead) or used as anchors. A page with an open draft — including one create-page made that is not published yet — is renamed on its draft: the new name is only published with the draft, and name_is_draft is true in the result. Hiding, moving and reordering always apply straight away. hidden in the result is the effective state (a hidden ancestor keeps a page hidden); hidden_self is this page's own setting. On a write-enabled connection list-pages includes hidden pages, flagged hidden: true.

upload-asset

ChatGPT
Upload an image or a downloadable file attachment so page content can reference it. Upload first, then use the returned usage snippet (or its path/filepath) in the page content — never invent upload paths or hotlink external URLs. Use type: "image" for images shown on the page (png, jpg, gif, webp, svg, …) and type: "attachment" for files viewers download (zip, pdf, sketch, fig, …). An image's path works anywhere content takes an upload path: an <img> element's src, or the image attribute of a do's & don'ts <rule>. Fetch the zeroheight://editor-instructions MCP resource for how the <img>, <attachments> and <rules> elements work.

get-page

Claude

get-page-asset

Claude

list-pages

Claude

list-releases

Claude

list-styleguides

Claude

search-pages

Claude

Capabilities

Writes

Similar Apps