create_frame
Generate a new frame in Figma directly through Claude Desktop using natural language commands, enabling AI-assisted design workflows.
Instructions
Create a new frame in Figma
Input Schema
| Name | Required | Description | Default |
|---|---|---|---|
No arguments | |||
Input Schema (JSON Schema)
{
"$schema": "http://json-schema.org/draft-07/schema#",
"additionalProperties": false,
"properties": {},
"type": "object"
}
Implementation Reference
- Handler function for the 'create_frame' MCP tool. It calls sendCommandToFigma to execute the Figma command and returns a text response with the created frame's ID or error.async ({ x, y, width, height, name, parentId, fillColor, strokeColor, strokeWeight, }) => { try { const result = await sendCommandToFigma("create_frame", { x, y, width, height, name: name || "Frame", parentId, fillColor: fillColor || { r: 1, g: 1, b: 1, a: 1 }, strokeColor: strokeColor, strokeWeight: strokeWeight, }); const typedResult = result as { name: string; id: string }; return { content: [ { type: "text", text: `Created frame "${typedResult.name}" with ID: ${typedResult.id}. Use the ID as the parentId to appendChild inside this frame.`, }, ], }; } catch (error) { return { content: [ { type: "text", text: `Error creating frame: ${error instanceof Error ? error.message : String(error)}`, }, ], }; } }
- Zod input schema for the 'create_frame' tool defining parameters like position, size, colors, etc.{ x: z.number().describe("X position"), y: z.number().describe("Y position"), width: z.number().describe("Width of the frame"), height: z.number().describe("Height of the frame"), name: z.string().optional().describe("Optional name for the frame"), parentId: z .string() .optional() .describe("Optional parent node ID to append the frame 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/index.ts:15-19 (registration)Calls registerCreationTools which includes registration of 'create_frame' tool.registerCreationTools(server); registerModificationTools(server); registerTextTools(server); registerComponentTools(server); }
- src/talk_to_figma_mcp/server.ts:34-34 (registration)Top-level registration call to registerTools which chains to create_frame registration.registerTools(server);