What is Bridge DS?
Bridge DS is not a standalone MCP server. It is a TypeScript compiler plus agent skills that turn a natural-language request into a spec, compile it against your design-system registries with 26 Figma API rules enforced, and run the result in Figma through the Figma Console MCP or the official Figma MCP.
Bridge compiles design-system intent into Figma output. A deterministic local compiler enforces 26 Figma API rules, so the README says output is design-system compliant by construction, not by after-the-fact verification. The agent writes a spec, and the compiler writes the Plugin API code.
Bridge ships no MCP server of its own. It uses a Figma MCP server as its transport, preferring Figma Console MCP and also supporting the official Figma MCP server.
What changes in your agent's output
- The agent produces a structured spec in YAML and a scene graph, not raw Figma Plugin API code written freehand.
- Every token reference is resolved against your registries, and missing tokens or hardcoded values are flagged before anything touches Figma.
- Real components, bound variables and text styles are used, per the README.
- A knowledge base in your repo stays in sync with Figma through a daily cron that opens a pull request on drift.
How the setup works
- Connect a Figma MCP server in your agent.
- Install the Bridge plugin in your coding agent, then say
setup bridgeinside your design-system repo. - Ask the agent to make a screen. Fix and done phrases capture corrections and archive the work.
Who Bridge DS is for
Best for
- Design system teams that need AI-generated Figma work to use real components and variables.
- Teams that want a repository-held knowledge base, with docs from tools like uSpec alongside it.
- Figma-first workflows built on the Figma MCP server or Framelink, where a design server such as Design Systems MCP supplies standards.
Not for
- Teams without Figma. The target is Figma Desktop or Cloud.
- Quick one-off generations. Setup scaffolds registries, a cron workflow and secrets, which the README says takes about ten minutes.
- Anyone expecting turnkey claims to hold unchecked. The README's guarantees describe the compiler's rules, so review output in Figma anyway.
Use it with UiChemy
Bridge produces designs inside Figma. UiChemy takes a Figma design into WordPress: Figma to WordPress turns it into editable blocks, and Composer edits the result inside Elementor or Gutenberg. Click Get Started on uichemy.com.
Connect Bridge DS: Compiler-Checked Figma Design Through MCP to your AI client
/plugin marketplace add noemuch/bridgeConnect a Figma MCP server
The README names figma-console-mcp as preferred and the official Figma MCP server as the alternative. Configure one first.
Install the plugin
In Claude Code, run
/plugin marketplace add noemuch/bridgeand then/plugin install bridge-ds. The repository also contains a Cursor plugin manifest.Bootstrap your DS repo
In your design-system repository, start your agent and say
setup bridge. The skill handles pre-flight, scaffolding, extraction, the GitHub secret and a first commit.Generate
Say
makefollowed by a description, such as a settings screen for account information. Usefixto capture manual Figma edits anddoneto archive.Diagnose
Run
bridge-ds doctorto check config, connectivity and knowledge base health.
Endpoints and ports
noemuch/bridgeAdded with /plugin marketplace addbridge-dsBinary exposed by the packagebridge-ds/knowledge-base/registries/Lives in your own repositoryWhat you can do with it
- 26 compiler rulesA deterministic compiler enforces Figma API rules and catches errors before anything touches Figma.
- Token resolutionEvery token reference is looked up in your registries, with fuzzy suggestions for missing tokens.
- Two transportsThe compiler adapts output for Figma Console MCP or the official Figma MCP server.
- Living knowledge baseA GitHub Actions cron pulls Figma through the REST API, detects drift and opens a pull request.
- Reusable recipesArchiving a screen can extract a parameterized recipe that later requests are scored against.
- Two plugin targetsThe repository carries manifests for a coding agent plugin and a Cursor plugin.
Tools it exposes
make (generating-figma-design)
Spec, compile, execute and verify a design from a description.
fix (learning-from-corrections)
Diffs your manual Figma corrections, extracts learnings and patches recipes.
done (shipping-and-archiving)
Runs the final gate, archives the work and extracts reusable recipes.
setup bridge (extracting-design-system)
Bootstraps a design-system repo end to end.
using-bridge
Auto-loaded at session start with rules, the command map and status procedures.
bridge-ds compile, doctor, extract, migrate, cron, setup
CLI commands the skills call: compile a scene graph, diagnose, extract from Figma, upgrade a knowledge base, run cron sync, scaffold.
Frequently asked questions
Is Bridge DS an MCP server?
No. It is a compiler, a set of agent skills and a CLI. It sends its compiled output to Figma through a Figma MCP server, preferring Figma Console MCP, and it also supports the official Figma MCP server. That is why this page lists skills and CLI commands.
How do I install Bridge DS?
Connect a Figma MCP server, add the plugin with /plugin marketplace add noemuch/bridge and /plugin install bridge-ds, then say setup bridge in your design-system repo. The README estimates about ten minutes end to end.
What does the compiler do?
It parses a scene graph, resolves every token reference against your registries, validates structure and variants, plans chunking for transport limits, generates Figma Plugin API code and wraps it for the chosen transport. Errors surface at compile time.
Does it guarantee compliant designs?
The README says output is compliant by construction, because the compiler enforces 26 rules and flags hardcoded values. That describes the compiler's checks. Review the Figma result anyway, since the spec the agent writes still comes from a model.
Which agents does it support?
The README documents a Claude Code plugin and a Cursor plugin, both using the same transport and compiler. The skills trigger on phrases such as make, fix, done and setup bridge, so other agents would need equivalent plugin support.
What does it need from my repository?
A design-system repo where it keeps a knowledge base of registries, guides and recipes. The README describes a daily GitHub Actions job that pulls Figma through the REST API, which requires a Figma token stored as a secret.
What license does it use?
The repository is MIT licensed, with an MIT badge in the README, and GitHub detects MIT. The README also links security and contributing documents, so read those before you adopt it across a design team or a shared design system.