“AI designs with you, not instead of you.” Figma’s positioning for useFigma, the new write-capable MCP tool that creates real components, variables, and auto layout on the canvas, not flat images or wireframes. The demo runs the full loop: terminal prompt to first draft, manual polish in Figma, annotations the agent later reads as design context, then back to the terminal to update the codebase. The annotations detail is the most interesting part — they double as machine-readable spec.

Designer advocate Amy Lima walks through a full code-to-canvas-to-code round trip on a sample app: install the MCP in Cursor with /add-plugin, authenticate via OAuth, generate a new screen iteration into Figma, refine it by hand, then prompt the agent to update the codebase and open a PR. Pairs well with the useFigma deep dive below.

The May edition is mostly a demo of Figma’s MCP server, with Amy Lima and Anthony DiSpezio walking through three workflows: code-to-canvas import of a vibe-coded prototype, round-tripping a dark mode so variables stay in sync between code and Figma, and using the pre-installed figma-use-scale skill to generate first-pass directions on a production dashboard. The closing update reel includes vector editing up to 10x faster, memory warnings down 92%, macOS eyedropper now samples anywhere on screen, FigJam MCP can read and write boards (ERDs, architecture diagrams), Make Kit packages your design system’s code for Figma Make, and Weave gets a timeline for video.

TJ Pitre’s Figma Console MCP is the most ambitious MCP server for Figma I’ve seen — 94+ tools spanning design-system extraction, file and FigJam and Slides creation, plugin debugging, and full-spectrum WCAG accessibility scanning across both design and code, including 13 design-side lint rules and code-side scanning via axe-core. Pair this with TJ’s Claude Design piece in the section above — it’s the same author making the case for what design-systems-aware AI tooling actually looks like.

Joey Banks: “…trying Figma Console MCP has completely opened my eyes into what I can offload. Not because it replaces the enjoyable work that I was doing before, but because it handled some of the longer, more repetitive tasks so quickly, and actually so well. Creating 200+ variables took seconds, and mapping them to color swatch instances so the team could preview values was way easier than I expected.”

“Join us to hear how Figma and OpenAI’s Codex are making design-to-code workflows more efficient and accurate. With the Figma MCP server, developers can easily bring design context into Codex to generate production-ready code. We’ll chat with Romain Huet, Head of Developer Experience at OpenAI, for a live demo, practical tips, and a Q&A session.”

Developer Advocate Akbar Mirza joins VS Code Live to discuss how the remote Figma MCP server and new Code Connect updates bring design and codebase context into VS Code, so you can generate production-ready code that is aligned with your design system.

The official Figma MCP server now supports Gemini CLI, OpenAI Codex, and Atlassian is coming soon.

Another demo of using the new MCP server with Claude Code.

Watch Lee Robinson go from design to code with GPT-5-Codex and Agent.

An official catalogue of agentic tools supporting context from the new Figma MCP server.

Thomas Lowry, Director of Advocacy at Figma, shares three best practices for designers to give developers—and the AI agents they use—the context they need to go from design to production.

Kris Rasmussen, CTO of Figma: ​“Today we’re announcing updates to the Figma MCP server and Code Connect that make it possible to bring Figma design context anywhere you work—whether it’s in your IDE, your AI agent, or your prototypes. These updates make your design context—context about how your design system is structured, how your codebase is written, and how your team builds products—more portable and powerful, helping you move from idea to product with less friction.”

This update includes three major releases. Remote access to the Figma MCP server from your IDE, an AI coding agent, or a browser-based model. Bring the underlying code from a Figma Make file to your codebase using the Figma MCP server. Code Connect’s new in-app mapping experience lets you browse components inside Figma, map them to the right code and file, and see which are linked or missing.

Matt Wierzbicki shows how to turn Figma designs made with shadcn/​ui into production‑ready code by setting up Cursor to use shadcn/​ui and Figma MCPs.