create_component_instance
Create a component instance in Figma by specifying its key and position coordinates to reuse design elements efficiently.
Instructions
Create an instance of a component in Figma
Input Schema
TableJSON Schema
| Name | Required | Description | Default |
|---|---|---|---|
| componentKey | Yes | Key of the component to instantiate | |
| x | Yes | X position | |
| y | Yes | Y position |
Implementation Reference
- src/talk_to_figma_mcp/server.ts:1204-1240 (registration)Registration of the MCP tool 'create_component_instance', including input schema validation with Zod and the handler function that forwards the request to the Figma plugin via WebSocket.
server.tool( "create_component_instance", "Create an instance of a component in Figma", { componentKey: z.string().describe("Key of the component to instantiate"), x: z.number().describe("X position"), y: z.number().describe("Y position"), }, async ({ componentKey, x, y }) => { try { const result = await sendCommandToFigma("create_component_instance", { componentKey, x, y, }); const typedResult = result as any; return { content: [ { type: "text", text: JSON.stringify(typedResult), } ] } } catch (error) { return { content: [ { type: "text", text: `Error creating component instance: ${error instanceof Error ? error.message : String(error) }`, }, ], }; } } ); - Input schema for the 'create_component_instance' tool using Zod for validation: componentKey (string), x (number), y (number).
{ componentKey: z.string().describe("Key of the component to instantiate"), x: z.number().describe("X position"), y: z.number().describe("Y position"), }, - Handler function for 'create_component_instance' tool. Sends the command with parameters to the Figma plugin via sendCommandToFigma, returns the result as text content or error message.
async ({ componentKey, x, y }) => { try { const result = await sendCommandToFigma("create_component_instance", { componentKey, x, y, }); const typedResult = result as any; return { content: [ { type: "text", text: JSON.stringify(typedResult), } ] } } catch (error) { return { content: [ { type: "text", text: `Error creating component instance: ${error instanceof Error ? error.message : String(error) }`, }, ], }; } } - TypeScript type definition for CommandParams of 'create_component_instance' used in sendCommandToFigma.
create_component_instance: { componentKey: string; x: number; y: number; };