mcp-figma

Instructions

Implementation Reference

• src/handlers/files.ts:39-51 (handler)

  The core handler function for the 'get_image' tool. It constructs query parameters from args and makes a request to Figma's /images/{fileKey} endpoint.

  async getImage(args: GetImageArgs) {
    const { fileKey, ids, scale, format, svg_include_id, svg_simplify_stroke, use_absolute_bounds } = args;
    
    const params: Record<string, string | number | boolean | undefined> = {
      ids: ids.join(','),
      scale,
      format,
      svg_include_id,
      svg_simplify_stroke,
      use_absolute_bounds
    };
  
    return this.api.makeRequest(`/images/${fileKey}${this.api.buildQueryString(params)}`);

• src/index.ts:167-205 (registration)

  Registration of the 'get_image' tool in the MCP server, including name, description, and detailed input schema.

  {
    name: 'get_image',
    description: 'Get images for nodes in a Figma file',
    inputSchema: {
      type: 'object',
      properties: {
        fileKey: {
          type: 'string',
          description: 'The key of the file to get images from'
        },
        ids: {
          type: 'array',
          items: { type: 'string' },
          description: 'Array of node IDs to render'
        },
        scale: {
          type: 'number',
          description: 'Optional. Scale factor to render at (0.01-4)'
        },
        format: {
          type: 'string',
          enum: ['jpg', 'png', 'svg', 'pdf'],
          description: 'Optional. Image format'
        },
        svg_include_id: {
          type: 'boolean',
          description: 'Optional. Include IDs in SVG output'
        },
        svg_simplify_stroke: {
          type: 'boolean',
          description: 'Optional. Simplify strokes in SVG output'
        },
        use_absolute_bounds: {
          type: 'boolean',
          description: 'Optional. Use absolute bounds'
        }
      },
      required: ['fileKey', 'ids']
    },

• src/types/files.ts:13-20 (schema)

  TypeScript interface defining the input arguments for the getImage handler, used for validation.

  export interface GetImageArgs {
    fileKey: string;
    ids: string[];
    scale?: number;
    format?: 'jpg' | 'png' | 'svg' | 'pdf';
    svg_include_id?: boolean;
    svg_simplify_stroke?: boolean;
    use_absolute_bounds?: boolean;

• src/index.ts:506-511 (registration)

  Dispatch handler for 'get_image' tool calls, validates args and invokes filesHandler.getImage.

  case 'get_image': {
    const args = this.validateArgs<GetImageArgs>(request.params.arguments, ['fileKey', 'ids']);
    const result = await this.filesHandler.getImage(args);
    return {
      content: [{ type: 'text', text: JSON.stringify(result, null, 2) }],
    };