The paper introduces figma-cli, a novel approach to connect Claude Code directly with Figma Desktop, aiming to circumvent the inefficiencies associated with traditional Multi-tool Coordinated Processor (MCP) architectures. It posits that existing AI-to-Figma tools, relying on MCPs, consume excessive tokens due to protocol overhead, overload context windows, and result in slower execution times.

The core methodology of figma-cli is based on establishing a direct, lightweight connection between Claude Code and Figma, rather than routing commands through an intermediary MCP server. This is achieved primarily through two mechanisms:

1. Figma Plugin Integration (Safe Mode): For standard operation, figma-cli provides a Figma plugin, "FigCli," which acts as a bridge. Once imported into Figma Desktop, this plugin facilitates communication between the terminal, where Claude Code is executed, and the Figma environment. This setup requires the plugin to be manually started at the beginning of each session, allowing Claude to connect and interact with Figma.

2. Direct WebSocket Connection (Yolo Mode): For advanced users seeking fully automated sessions, "Yolo Mode" allows figma-cli to patch Figma Desktop once to enable a direct WebSocket connection on a random debug port. This bypasses the need for the manual plugin startup, enabling immediate, automatic connection between Claude Code and Figma.

The central technical innovation for Claude Code's understanding and adaptability lies in the CLAUDE.md file. Instead of relying on complex API definitions, tool schemas, or rigid code changes for new functionalities, Claude Code reads this Markdown file directly. The CLAUDE.md file pre-defines all available commands, common request mappings, design patterns, and best practices. This architecture allows for unparalleled customizability; users can extend Claude's capabilities, add new workflows, or refine existing ones simply by editing this Markdown file, without any programming knowledge or re-compilation. This contrasts sharply with MCPs, where new features typically necessitate new tool definitions, schemas, and handlers within the server architecture.

This direct connection and CLAUDE.md-driven approach offer several advantages:

• Faster Execution: Commands execute in approximately 100-200ms, significantly faster than typical MCP-based solutions.
• Reduced Token Usage: Eliminates protocol overhead, leading to a more efficient use of the AI model's context window.
• Enhanced Context Retention: With less boilerplate filling the context window, Claude Code can maintain a more coherent understanding of the ongoing design project.
• Simplified Customization: The CLAUDE.md file enables rapid and flexible adaptation of Claude's design workflows.

figma-cli provides extensive capabilities through natural language commands, including:

• Generating full UI kits (e.g., all 30 shadcn/ui components with variants).
• Inserting real SVG icons from over 50 icon sets.
• Managing design tokens (creating, binding, exporting to CSS or Tailwind, supporting light/dark modes).
• Performing design analysis and linting (color, typography, spacing audits, WCAG compliance checks, auto-fixing issues).
• Exporting designs to various formats (PNG, SVG, PDF, React JSX code, Storybook stories, CSS custom properties, Tailwind config).
• Full support for FigJam functionalities.
• Integration with Figma Team Libraries.

The setup is minimal, requiring Node.js, Figma Desktop, and Claude Code. The process involves cloning the figma-cli repository, importing the provided Figma plugin, and then initiating Claude Code, which automatically reads CLAUDE.md to become fully operational.