MCP Directory

How to add Figma MCP Server (Official Remote) to Cursor

Official Figma server that brings design context, variables, and components into AI coding tools. Paste the config into ~/.cursor/mcp.json and restart Cursor.

Last updated June 15, 2026 · 120 · http · oauth · official

Cursor config for Figma MCP Server (Official Remote)

Add MCP server URL https://mcp.figma.com/mcp (HTTP) and sign in via Figma OAuth
{
  "mcpServers": {
    "figma-mcp-server-official-remote": {
      "url": "https://mcp.figma.com/mcp",
      "type": "streamable-http"
    }
  }
}

Remote server — no local install needed. Restart the client after saving the config.

Setup steps

  1. 1Open Cursor → Settings → MCP → Add new MCP server (or edit ~/.cursor/mcp.json directly).
  2. 2Paste the Figma MCP Server (Official Remote) config below into the "mcpServers" object.
  3. 3Fill in placeholder secrets, then save.
  4. 4Cursor reloads MCP servers automatically — check Settings → MCP for a green status dot.
  5. 5Ask Cursor to use one of Figma MCP Server (Official Remote)'s tools to confirm it's connected.

Before you start

  • An active Figma account. The remote server works on all seats/plans; the local desktop server needs a Dev or Full seat on a paid plan.
  • An MCP-compatible client (VS Code + Copilot, Cursor, Windsurf, Claude Code, Gemini CLI, etc.).
  • For the remote server: OAuth — you authorize in the browser on first connect; no token to copy.
  • For the local server: the Figma desktop app running, with the Dev Mode MCP server enabled in preferences.
  • Acceptance of the Figma Developer Terms; write-to-canvas usage may be metered/paid after beta.

What Figma MCP Server (Official Remote) can do in Cursor

get_design_context

Get the full design context (layout, components, styles) for the current selection or a layer.

get_metadata

Return a sparse XML map of layer IDs, names, types, positions, and sizes.

get_variable_defs

Return the variables and styles (design tokens) used in the selection.

get_screenshot

Capture a screenshot of the current selection for visual grounding.

get_code_connect_map

Retrieve mappings between Figma nodes and Code Connect code components.

add_code_connect_map

Map a Figma node ID to its corresponding code component in your codebase.

search_design_system

Search connected libraries for components, variables, and styles.

get_libraries

List subscribed and available design libraries for a file.

Security

OAuth grants the server access to your Figma account and files; review the requested scopes and only authorize on trusted clients. As a hosted service, file context is transmitted to Figma's servers.

Figma MCP Server (Official Remote) + Cursor FAQ

Where is the Cursor config file?

Cursor reads MCP servers from ~/.cursor/mcp.json. Paste the Figma MCP Server (Official Remote) config there under the "mcpServers" key and restart the client.

Is Figma MCP Server (Official Remote) safe to use with Cursor?

OAuth grants the server access to your Figma account and files; review the requested scopes and only authorize on trusted clients. As a hosted service, file context is transmitted to Figma's servers.

What's the difference between the remote and local Figma MCP servers?

The remote server is hosted by Figma at https://mcp.figma.com/mcp, uses OAuth, and works on all seats/plans with no install. The local server runs inside the Figma desktop app and targets Dev/Full seats on paid plans.

Do I need a paid Figma plan?

The remote server works on all seats and plans (with lower rate limits on Starter/View/Collab seats). The local desktop server requires a Dev or Full seat on a paid plan.

How does authentication work — is there an API key?

The remote server uses OAuth: you authorize in the browser on first connect, so there's no token to copy. The local server authenticates through your signed-in Figma desktop app.

View repo Full Figma MCP Server (Official Remote) page