Home / Tutorial · ✦ Official

Set Up the Figma MCP Server in Cursor

Cursor Team · Cursor Docs ·

The official setup for connecting Figma's Dev Mode MCP server to Cursor so the agent reads selected frames, variables and Auto Layout directly — then generates code that respects your design tokens. Includes the Cursor MCP install flow and prompting tips.

Publisher summary

Model Context Protocol (MCP) lets Cursor connect to external tools. Add the Figma Dev Mode MCP server to pull design context — frames, variables, components — directly into the agent.

In this article

  • What MCP is and how Cursor uses it
  • Enable Figma Dev Mode MCP server (desktop app)
  • Add the Figma MCP server in Cursor settings
  • Select a frame or paste a Figma link, then prompt
  • Best practices: Auto Layout, variables, semantic names

Source: Cursor Docs

Read original Content lives on the original publisher's site.
Curated for the Cursor-Design community as a first-party reference on designing with Cursor.