Skip to main content
Glama

Cursor Talk to Figma MCP

by paragdesai1

create_rectangle

Add a rectangle to Figma designs programmatically through Cursor AI using the MCP integration for precise design modifications.

Instructions

Create a new rectangle in Figma

Input Schema

NameRequiredDescriptionDefault

No arguments

Input Schema (JSON Schema)

{ "$schema": "http://json-schema.org/draft-07/schema#", "additionalProperties": false, "properties": {}, "type": "object" }

Implementation Reference

  • Core implementation of create_rectangle tool. Creates a Figma Rectangle node with figma.createRectangle(), sets position (x,y), size (width,height), name, handles optional parentId by appending to specified parent or current page, returns node details.
    async function createRectangle(params) { const { x = 0, y = 0, width = 100, height = 100, name = "Rectangle", parentId, } = params || {}; const rect = figma.createRectangle(); rect.x = x; rect.y = y; rect.resize(width, height); rect.name = name; // If parentId is provided, append to that node, otherwise append to current page if (parentId) { const parentNode = await figma.getNodeByIdAsync(parentId); if (!parentNode) { throw new Error(`Parent node not found with ID: ${parentId}`); } if (!("appendChild" in parentNode)) { throw new Error(`Parent node does not support children: ${parentId}`); } parentNode.appendChild(rect); } else { figma.currentPage.appendChild(rect); } return { id: rect.id, name: rect.name, x: rect.x, y: rect.y, width: rect.width, height: rect.height, parentId: rect.parent ? rect.parent.id : undefined, }; }
  • MCP server.tool registration for 'create_rectangle'. Defines tool name, description, Zod input schema (x,y,width,height,name,parentId), thin handler proxying to Figma plugin via sendCommandToFigma with error handling and MCP content response.
    server.tool( "create_rectangle", "Create a new rectangle in Figma", { x: z.number().describe("X position"), y: z.number().describe("Y position"), width: z.number().describe("Width of the rectangle"), height: z.number().describe("Height of the rectangle"), name: z.string().optional().describe("Optional name for the rectangle"), parentId: z .string() .optional() .describe("Optional parent node ID to append the rectangle to"), }, async ({ x, y, width, height, name, parentId }) => { try { const result = await sendCommandToFigma("create_rectangle", { x, y, width, height, name: name || "Rectangle", parentId, }); return { content: [ { type: "text", text: `Created rectangle "${JSON.stringify(result)}"`, }, ], }; } catch (error) { return { content: [ { type: "text", text: `Error creating rectangle: ${error instanceof Error ? error.message : String(error) }`, }, ], }; } } );
  • Zod input schema validation for create_rectangle tool parameters: x,y (positions), width,height (dimensions), optional name and parentId.
    x: z.number().describe("X position"), y: z.number().describe("Y position"), width: z.number().describe("Width of the rectangle"), height: z.number().describe("Height of the rectangle"), name: z.string().optional().describe("Optional name for the rectangle"), parentId: z .string() .optional() .describe("Optional parent node ID to append the rectangle to"), },
  • Dispatch handler in Figma plugin's handleCommand switch statement that routes 'create_rectangle' command to the createRectangle implementation.
    case "create_rectangle": return await createRectangle(params); case "create_frame":
  • Type definition FigmaCommand includes "create_rectangle" for sendCommandToFigma type safety.
    | "create_rectangle" | "create_frame"

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/paragdesai1/parag-Figma-MCP'

If you have feedback or need assistance with the MCP directory API, please join our Discord server