Claude Talk to Figma MCP

Instructions

Implementation Reference

• src/talk_to_figma_mcp/tools/creation-tools.ts:315-349 (handler)

  Handler function for the 'create_polygon' MCP tool. It constructs parameters with defaults and sends a websocket command to Figma using sendCommandToFigma, then returns success/error text response.

  async ({ x, y, width, height, sides, name, parentId, fillColor, strokeColor, strokeWeight }) => {
    try {
      const result = await sendCommandToFigma("create_polygon", {
        x,
        y,
        width,
        height,
        sides: sides || 6,
        name: name || "Polygon",
        parentId,
        fillColor,
        strokeColor,
        strokeWeight,
      });
      
      const typedResult = result as { id: string, name: string };
      return {
        content: [
          {
            type: "text",
            text: `Created polygon with ID: ${typedResult.id} and ${sides || 6} sides`
          }
        ]
      };
    } catch (error) {
      return {
        content: [
          {
            type: "text",
            text: `Error creating polygon: ${error instanceof Error ? error.message : String(error)}`
          }
        ]
      };
    }
  }

• src/talk_to_figma_mcp/tools/creation-tools.ts:287-314 (schema)

  Zod input schema for the 'create_polygon' tool parameters including position, dimensions, number of sides, name, parent, and optional color/stroke properties.

  {
    x: z.number().describe("X position"),
    y: z.number().describe("Y position"),
    width: z.number().describe("Width of the polygon"),
    height: z.number().describe("Height of the polygon"),
    sides: z.number().min(3).optional().describe("Number of sides (default: 6)"),
    name: z.string().optional().describe("Optional name for the polygon"),
    parentId: z.string().optional().describe("Optional parent node ID to append the polygon to"),
    fillColor: z
      .object({
        r: z.number().min(0).max(1).describe("Red component (0-1)"),
        g: z.number().min(0).max(1).describe("Green component (0-1)"),
        b: z.number().min(0).max(1).describe("Blue component (0-1)"),
        a: z.number().min(0).max(1).optional().describe("Alpha component (0-1)"),
      })
      .optional()
      .describe("Fill color in RGBA format"),
    strokeColor: z
      .object({
        r: z.number().min(0).max(1).describe("Red component (0-1)"),
        g: z.number().min(0).max(1).describe("Green component (0-1)"),
        b: z.number().min(0).max(1).describe("Blue component (0-1)"),
        a: z.number().min(0).max(1).optional().describe("Alpha component (0-1)"),
      })
      .optional()
      .describe("Stroke color in RGBA format"),
    strokeWeight: z.number().positive().optional().describe("Stroke weight"),
  },

• src/talk_to_figma_mcp/tools/creation-tools.ts:285-350 (registration)

  Direct registration of the 'create_polygon' tool on the MCP server instance inside registerCreationTools function.

    "create_polygon",
    "Create a new polygon in Figma",
    {
      x: z.number().describe("X position"),
      y: z.number().describe("Y position"),
      width: z.number().describe("Width of the polygon"),
      height: z.number().describe("Height of the polygon"),
      sides: z.number().min(3).optional().describe("Number of sides (default: 6)"),
      name: z.string().optional().describe("Optional name for the polygon"),
      parentId: z.string().optional().describe("Optional parent node ID to append the polygon to"),
      fillColor: z
        .object({
          r: z.number().min(0).max(1).describe("Red component (0-1)"),
          g: z.number().min(0).max(1).describe("Green component (0-1)"),
          b: z.number().min(0).max(1).describe("Blue component (0-1)"),
          a: z.number().min(0).max(1).optional().describe("Alpha component (0-1)"),
        })
        .optional()
        .describe("Fill color in RGBA format"),
      strokeColor: z
        .object({
          r: z.number().min(0).max(1).describe("Red component (0-1)"),
          g: z.number().min(0).max(1).describe("Green component (0-1)"),
          b: z.number().min(0).max(1).describe("Blue component (0-1)"),
          a: z.number().min(0).max(1).optional().describe("Alpha component (0-1)"),
        })
        .optional()
        .describe("Stroke color in RGBA format"),
      strokeWeight: z.number().positive().optional().describe("Stroke weight"),
    },
    async ({ x, y, width, height, sides, name, parentId, fillColor, strokeColor, strokeWeight }) => {
      try {
        const result = await sendCommandToFigma("create_polygon", {
          x,
          y,
          width,
          height,
          sides: sides || 6,
          name: name || "Polygon",
          parentId,
          fillColor,
          strokeColor,
          strokeWeight,
        });
        
        const typedResult = result as { id: string, name: string };
        return {
          content: [
            {
              type: "text",
              text: `Created polygon with ID: ${typedResult.id} and ${sides || 6} sides`
            }
          ]
        };
      } catch (error) {
        return {
          content: [
            {
              type: "text",
              text: `Error creating polygon: ${error instanceof Error ? error.message : String(error)}`
            }
          ]
        };
      }
    }
  );

• src/talk_to_figma_mcp/tools/index.ts:15-15 (registration)

  registerTools calls registerCreationTools(server), which registers the create_polygon tool among others.

  registerCreationTools(server);

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

  Main server initialization calls registerTools(server), starting the chain that registers create_polygon.

  registerTools(server);