Figma to web for coding agents. A pack of skills and scripts that help you get the most out of Figma's MCP server when turning designs into code.
View on GitHub ↗Homepage ↗A pantograph copies a drawing by linkage, not by eye. This does the same for Figma pages: pulled once, distilled by script, built from disk, verified against the source.
Two skills for a coding agent that turn a Figma board of designed pages into shipped web pages, without letting the agent guess at anything it could read.
The method is deterministic. The agent pulls the design once into durable local files, distills copy and image slots out of them with a script instead of reading 200k characters by eye, builds from disk, and verifies with independent audits. Copy comes from the design's text nodes, dimensions from node attributes, icons from name and geometry matching. Screenshots are for orientation and QA, never for transcription.
The second skill turns the result into a review page: the Figma frame beside the build, section by section, with the height deltas that show where they diverge. The page is mobile friendly, so the work can be checked at a desk or on the go.
Anyone rebuilding a designed site from Figma with a coding agent, in any framework, with any CMS or none. The skills carry the method. Project specifics stay in the host repo.
Pantograph grew up on marketing sites, mostly B2B, and that is where it has worked well. Other kinds of projects may need some massaging, and your mileage may vary.
- A Figma seat that can read the file. Dev or Full on the plan that owns it. View seats get roughly six MCP reads a month, which is not enough for a page. Dev or Full on an Organization plan gets 200 reads a day, 20 a minute. - The Figma MCP server connected in your
From the project README.
Add the radar badge to your README — it shows your project was picked up by MCP Radar and links to this page:
[](https://mcp.liqiwa.com/s/tonyseets--pantograph.html)
Open-source MCP server for comparing products and asking the buyer before purchase.
sv-number/mcp-serverMCP server for AI agents that need a phone number: order a private number in 200+ countries, read the SMS verification code, hand it back. The widest country coverage in the category, and you can chec
vibeinging/deepseek-harness-desktop-appDeepSeek Harness Desktop App: a local AI desktop workspace for DSH Sessions, projects, files, web research, plugins, and Office artifacts.
shlokkhemani/rabbitholeAn infinite canvas for learning — select text, ask, and answers branch out as documents. MCP server for Claude Code, Codex, and any agent.
livetennisapi/livetennisapi-mcpMCP server for the Live Tennis API — give Claude, Cursor and other LLM agents real-time tennis scores, odds and model win-probability
springvoiceswell/semrush-ai-toolSemrush SEO AI-powered analysis tool MCP server & CLI for keyword research, domain analytics, backlink analysis
The top new MCP servers of the week, every Monday. No spam, unsubscribe anytime.