figma

Automate Figma design workflows via REST API, Plugin API, and MCP server.

30|5|Updated Jul 25, 2025
One-click install
npx skills add https://github.com/phuetz/code-buddy --skill figma-phuetz
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: figma
Source: https://github.com/phuetz/code-buddy/tree/main/.codebuddy/skills/bundled/figma
Command: npx skills add https://github.com/phuetz/code-buddy --skill figma-phuetz

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill automates repetitive Figma design workflows, enabling teams to programmatically access files, export assets, and synchronize design data across tools.

Core Features & Use Cases

  • REST API integration to fetch files, nodes, and metadata.
  • MCP server integration for command-driven automation across teams.
  • Asset export, design tokens extraction, and code generation from frames.
  • Use Case: Export assets from a file and generate React components.

Quick Start

Set FIGMA_ACCESS_TOKEN and FIGMA_FILE_KEY in your environment, then begin automating with a simple workflow to fetch file data and export assets.

Frequently Asked Questions about figma

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I automate Figma asset export and code generation from design frames?

Set the FIGMA_ACCESS_TOKEN and FIGMA_FILE_KEY environment variables in a Node.js or curl-based environment to authenticate REST API and MCP server requests for fetching Figma files and exporting assets.

Can I synchronize design tokens from Figma across different toolchains?

The skill supports command-driven automation across teams by leveraging the MCP server to access Figma files, nodes, and assets, enabling synchronized design token extraction and code generation.

Does this Figma automation skill require a Plugin API setup or just REST access?

It supports both REST API and Plugin API workflows, requiring environment variables FIGMA_ACCESS_TOKEN and FIGMA_FILE_KEY to fetch files, access nodes, and export assets without extensive manual plugin setup.

What is the best way to fetch Figma file metadata via REST API for design automation?

The best way to fetch Figma file metadata is by configuring your FIGMA_ACCESS_TOKEN and executing REST API requests in a Node.js environment to retrieve files, nodes, and assets for design automation.

Why does my Figma REST API workflow require specific environment variables to function?

Figma REST API workflows require FIGMA_ACCESS_TOKEN and FIGMA_FILE_KEY environment variables to authenticate your session and target the specific design file needed for asset export and node access.