Skip to main content
Glama

create_component_instance

Create a new instance of a Figma component at specified coordinates to reuse design elements and maintain consistency across projects.

Instructions

Create an instance of a component in Figma

Input Schema

TableJSON Schema
NameRequiredDescriptionDefault
componentKeyYesKey of the component to instantiate
xYesX position
yYesY position

Implementation Reference

  • The async handler function that sends the 'create_component_instance' command to Figma using sendCommandToFigma and processes the response or error.
    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 defined with Zod for validating the tool parameters: 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"), },
  • Registration of the 'create_component_instance' tool on the MCP server using server.tool(), including name, description, schema, and handler.
    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)}`, }, ], }; } } );

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/arinspunk/claude-talk-to-figma-mcp'

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