create_rectangle

Instructions

Implementation Reference

• src/cursor_mcp_plugin/code.js:207-246 (handler)

  Core handler function that creates a rectangle in Figma using figma.createRectangle(), sets its position, dimensions, name, and appends it to a specified parent node or the current page.

  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,
    };
  }

• src/talk_to_figma_mcp/server.ts:121-156 (registration)

  MCP tool registration for 'create_rectangle', including schema definition with Zod and proxy handler that forwards to Figma plugin via sendCommandToFigma.

  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)}`
            }
          ]
        };
      }
    }
  );

• src/cursor_mcp_plugin/code.js:73-74 (registration)

  Registration/dispatch of 'create_rectangle' command in the Figma plugin's handleCommand switch statement.

  case "create_rectangle":
    return await createRectangle(params);

• src/talk_to_figma_mcp/server.ts:125-131 (schema)

  Input schema for create_rectangle tool using Zod validation.

    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")
  },