Figma-AI-Bridge: Skill for Claude Code

Figma Slides

Build presentation slides in Figma. One command per slide via create_slide, or batch multiple slides. Combine with online-research skill for data-driven decks.

MANDATORY: Every deck must be organized into logical sections. Each section = one row on the canvas, starting with a cover slide cloned from an existing template. The agent must autonomously decide how to divide content into sections — do NOT ask the user for section structure.

Prerequisites

• figma-ai-bridge plugin running in Figma and connected
• The create_slide command registered in code.js
• Helper: scripts/figma_cmd.mjs <channel> create_slide '<paramsJSON>'

Slide Types

Type 1: title — Section Cover / Title Slide

Clone an existing slide template via templateNodeId to get the decorative background, then update text.

{
  "type": "title",
  "templateNodeId": "<node-id>",
  "header": "Project Name",
  "title": "Presentation Title",
  "x": 0, "y": 0
}

• Always use templateNodeId — cover slides must clone a template for visual style
• Discover the template autonomously: Use get_selection, or scan with get_document_info and get_node_info to find an INSTANCE named "Slide templates". Only ask the user if no template exists.

Type 2: content — Title + Body + Key Points (Two-Column)

Left column has body text, right column has bold heading + description pairs.

{
  "type": "content",
  "title": "Key Findings",
  "body": "Our research across three verticals revealed...",
  "points": [
    {"heading": "Finding One", "description": "Details about the first finding..."},
    {"heading": "Finding Two", "description": "Details about the second finding..."}
  ],
  "x": 0, "y": 0
}

Type 3: visual — Title + Body + Cloned Visual

Left side has title and body. Right side clones an existing Figma node (UI mockup, screenshot, diagram).

{
  "type": "visual",
  "title": "Feature Preview",
  "body": "This shows the new user onboarding flow...",
  "imageNodeId": "<node-id>",
  "x": 0, "y": 0
}