Figma recently introduced its MCP (Model Context Protocol) servers, enabling two-way connections between Figma files and agentic code agents such as Cursor and Claude Code. This enables easier workflows between design and development. It’s still a new thing, though, and we’ll have to wait and see how and if it will be adopted in practical workflows.
Earlier generative AI tools for design, such as Lovable and Figma Make, were launched with the vision to allow designers to entirely prompt design solutions. However, in reality, those tools fell short of the vision. One reason is the limited control over the design, making it hard for designers to iterate on details. Due to this limitation, most designers still want to do their UI design work manually, and many are hesitant to utilise generative AI tools in their workflow. However, developers are increasingly using agenting AI tools such as Claude Code to implement designs, and we’ve needed a better way to integrate design files with agentic AI tools for code.
What Is Figma MCP?
MCP (Model Context Protocol) is a standardized way to connect AI tools such as Cursor and Claude Code with databases, APIs, and other sources, such as Figma design files. Figma’s new MCP servers now make it possible to connect a Figma design to AI tools such as Claude Code. Thus, it allows a two-way sync between the design prototype in Figma and codebases.
Related: AI in UI/UX Design: Tools, Workflows & Research in 2025
What does the Figma MCP server mean In Practice?
The last step of the designer-developer handoff is going from the design to code. Figma MCP servers now make this process easier by allowing the developers to connect their agentic AI tools, such as Cursor or Claude Code, to design files in Figma. Once a two-way sync is established between the Figma files and the agentic tools, you can “push” design changes to the codebase using an agentic AI. It’s like GitHub, but between design files and the codebase.
I believe this will improve the integration of AI code agents with design work. As I’ve mentioned in previous posts, I think one of the main strengths of generative AI for code is to bridge design and development practices. However, setting up the connection between Figma and Claude Code still requires technical skills that many designers might not have. So, I’d encourage all designers to start getting acquainted with it now, as I think the future of design is moving towards a process where design is much more integrated with code development and where agentic AI coding tools will increasingly blur the lines between designers and developers.
Here’s a good guide by UI Collective for getting started with Figma MCPs and Claude Code.