Figma

You can run a dedicated MCP server to control Figma from natural language prompts via Cursor Agent. This setup lets you create and modify designs through simple prompts, with a lightweight server bridge and a Figma plugin that executes the requested operations.

How to use

Start the MCP server and plug it into Cursor Agent to enable end-to-end design automation. You will connect Cursor Agent to the server URL, then send natural language prompts to generate or modify Figma designs. Use prompts to create layouts, sections, shapes, text, and other design elements, or to adjust existing designs.

How to install

cd figma_mcp

Configure the MCP server by copying the example environment file and editing your Figma token. Then install dependencies and start the server.

cd figma-mcp-server
cp .env.example .env  # Edit this file to add your Figma token
bun install
bun run index.ts

Set up the Figma plugin so it can receive instructions from the MCP server. Build the plugin and import it into Figma.

cd figma-plugin
npm install
npm run build

Then import the plugin into Figma:

1. Open Figma
2. Go to Plugins > Development > Import plugin from manifest
3. Select the figma-plugin/manifest.json file

## Additional setup and connections

Connect Cursor Agent to the MCP server by adding the MCP server URL in the agent settings. This enables you to issue prompts from Cursor that are transformed into design operations in Figma.

http://localhost:3000/api/mcp/schema

## Notes on tokens and environment

Create a Figma token in your environment and reference it in the server configuration. This token authorizes the server to interact with your Figma files.

## Example flow with Cursor Agent

After everything is set up, you can prompt with natural language to create or modify a page. Cursor processes your request and the MCP server translates it into instructions sent to the Figma plugin, which executes the design changes in your document.