MasterGo Magic MCP

A MasterGo MCP server that hands agents the DSL of a design file from a link so they rebuild the layout as HTML or a component.

  • 289 ★ on the repository
  • Last commit
MCP serverOfficial

Extended access

Why this level

  • The MasterGo token grants read access to team design files; keep it in the client environment.
  • Mockup data goes into the model context.
All reasons and checks

mastergo-design/mastergo-magic-mcp

Install

In your terminal, with SkillFoxx CLI

npx skillfoxx add mcp/mastergo-magic-mcp

Detects the agents on your machine, shows the access level and pins the version.

Other ways to install

Access and checks

How we review

Extended accessThe tool runs code or makes network calls and only reads external data.

  • The MasterGo token grants read access to team design files; keep it in the client environment.
  • Mockup data goes into the model context.

This is third-party code. Review the repository files before installing.

What it does

MasterGo Magic MCP connects the MasterGo editor to an agent. From a file or layer link the agent receives DSL, pulls out SVG and texts, reads metadata and builds HTML or a component from them. The tools `mcp__getDsl`, `mcp__getDesignSvgs`, `mcp__getDesignTexts`, `mcp__extractSvg` and `mcp__getMeta` return data as JSON, YAML or the compact `tree` format that spends fewer tokens. `getComponentWorkflow` outlines the development order for Vue and React components.

Who it is for. Frontend developers whose mockups live in MasterGo and need to become code through Cursor, Cline or another MCP client.

Good fit when

  • A designer sent a MasterGo layer link and the markup must come without measuring sizes by hand.
  • Icons from the mockup need to be pulled out as SVG and previewed in HTML right away.
  • A Vue or React component is built from a specification in the design file.
  • Tokens are burned on long mockups, so the `tree` format is needed instead of JSON.

Not a fit when

  • Mockups live in Figma or another editor: the server works with MasterGo only.
  • The file stays in drafts: MCP access to it is closed.
  • The account is on the personal free plan: MCP tools return a permission error.

Example request

Restore the design from https://mastergo.com/file/ID?layer_id=ID and save the result as an HTML file.

MCP

Transport
stdio, http
Authentication
API key

Environment variables

`MG_MCP_TOKEN` required, secret
MasterGo personal access token; `MASTERGO_API_TOKEN` works instead.
`API_BASE_URL`
API base URL, for example `https://mastergo.com`.
`RULES`
JSON array of design rules, for example `["rule1", "rule2"]`.
`DEFAULT_FORMAT`
Output format for design data: `json`, `yaml` or `tree`.

Limitations

A MasterGo Team Edition account or higher is required; the personal free edition does not support MCP. Files must sit in team projects, data is not read from drafts. A personal token from the security settings is needed. Local launch requires Node.js, and a proxy can be set with `--proxy`. Some clients drop tools with a double `mcp__` prefix: the `--no-prefix` flag exists for them. The README calls the `tree` mode experimental. The repository has no license file, the README states the ISC license.

How to disable. Remove the `mastergo-magic-mcp` entry from the MCP client config and revoke the token in MasterGo security settings.

FAQ

Where do I get a token?

In MasterGo personal settings: the security tab, the personal access token item, the generate button.

Why do I get a permission error?

Usually the account is below Team Edition or the file is in drafts. Move the file into a team project.

Can I skip local installation?

Yes. The README has a remote option, `https://mastergo.com/mcp/xf/sse`, with the `x-mg-useraccesstoken` header.

How do I cut token usage?

Pass `--format=tree` at launch or ask for the tree format in the prompt.

Which clients are covered in the instructions?

Cursor, Cline, Lingma and Open Code. Smithery has a separate install path through its website.

Discussion

No questions or reviews yet.

From a Lanhu design link an agent gets HTML with CSS, design tokens, layers and slices, with no manual export from the editor.

MCP serverExtended access148Repository stars

A design studio for people and agents: dsa CLI, MCP endpoint and skill to edit layouts, slides, reports and 3D together.

CLIExtended access229Repository stars

Figma to code over MCP: the server gives the agent a layout as compact YAML with CSS property names, resolved variables and SVG exported to disk

MCP serverExtended access7Repository stars
Official

Figma's official MCP server: code from a selected frame, design system variables and components, and writing designs to the canvas

MCP serverExtended access2.2KRepository stars

A community MCP server with a Figma plugin: the agent creates frames, text and components in the open file, not just reads them

MCP serverBroad access177Repository stars
Official

21st.dev MCP server and plugin: search ready React/Tailwind components and logos and generate UI from your agent

MCP serverExtended access6.5KRepository stars

README in short

The server runs through npx and works with a MasterGo token. The README has ready configuration blocks for Cursor, Cline, Lingma and Open Code.

README badge

Report a problem