Show HN：Figma-use – 用於控制 Figma 的命令列介面，支援 AI 代理

Navigation Menu

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

To see all available qualifiers, see our documentation.

Control Figma from the command line. Full read/write access for AI agents — create shapes, text, components, set styles, export images. 73 commands.

License

Uh oh!

There was an error while loading. Please reload this page.

dannote/figma-use

Folders and files

Latest commit

History

Repository files navigation

figma-use

CLI for Figma. LLMs already know React and work great with CLIs — this combines both.

No JSON schemas, no MCP protocol overhead — just JSX that any LLM can write.

📄 Includes SKILL.md — drop-in reference for Claude Code and other AI agents.

▶️ Watch the demo — AI builds a button component set in Figma in seconds.

Why CLI over MCP?

MCP servers exchange verbose JSON. CLIs are token-efficient:

vs MCP JSON request + response: ~200 tokens for the same operation.

For AI agents doing dozens of Figma operations, this adds up fast.

Why JSX?

Every LLM has been trained on millions of React components. They can write this without examples:

The render command takes this JSX and creates real Figma nodes — frames, text, components, auto-layout, the works.

Installation

Open Figma → Plugins → Development → Figma Use

Render: JSX → Figma (Experimental)

⚠️ Uses Figma's internal multiplayer protocol — ~100x faster than plugin API, but may break if Figma changes it.

Setup

Basic Usage

Supported Elements

Frame, Rectangle, Ellipse, Text, Line, Star, Polygon, Vector, Group

Style Properties

Reusable Components

defineComponent creates a Figma Component. First usage renders the master, subsequent usages create Instances:

Component Variants

defineComponentSet creates a Figma ComponentSet with all variant combinations:

This creates 4 variant components (Primary/Small, Primary/Large, Secondary/Small, Secondary/Large) inside a ComponentSet, plus instances with the requested variants.

Variable Bindings

Bind colors to Figma variables by name:

The value is a fallback. At render time, colors get bound to actual Figma variables by name.

CLI Commands

The render command is the fastest way to create complex layouts. For simpler operations or modifications, use direct commands:

Create

Modify

Query

Export

Navigate

Variables & Styles

Escape Hatch

Output

Human-readable by default:

Add --json for machine parsing:

For AI Agents

Includes ready-to-use SKILL.md — a comprehensive reference that teaches AI agents all commands and patterns. Works with Claude Code, Cursor, and any agent that supports skill files.

For simpler setups, add to your project's AGENTS.md:

How It Works

License

MIT

About

Control Figma from the command line. Full read/write access for AI agents — create shapes, text, components, set styles, export images. 73 commands.

Topics

Resources

License

Contributing

Uh oh!

There was an error while loading. Please reload this page.

Stars

Watchers

Forks

Releases

Packages

  0

Languages

Footer

Footer navigation