figma-automation

Orchestrate Rube MCP to automate Figma file, component, token, and export workflows.

Updated Mar 7, 2026
One-click install
npx skills add https://github.com/huivrotiki/antigravity-code-workspace-copy --skill figma-automation
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: figma-automation
Source: https://github.com/huivrotiki/antigravity-code-workspace-copy/tree/main/02-Skills/figma-automation
Command: npx skills add https://github.com/huivrotiki/antigravity-code-workspace-copy --skill figma-automation

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Automates Figma workflows by orchestrating Rube MCP to manage files, components, design tokens, comments, and exports.

Core Features & Use Cases

  • Get File Data and Components: Fetch file data and list published components.
  • Export and Render Images: Render nodes as images and export assets.
  • Extract Design Tokens: Extract colors, typography, spacing for design-to-code handoff.
  • Manage Comments and Versions: View and add comments, and inspect version history.
  • Browse Projects and Teams: List team projects and project files to locate assets quickly.

Quick Start

Connect Rube MCP to Figma, then fetch the target file's data and list its published components.

Frequently Asked Questions about figma-automation

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

FAQPage Schema
How do I extract design tokens from Figma for design-to-code handoff?

You extract design tokens from Figma by orchestrating the Rube MCP to fetch file data and pull colors, typography, and spacing values. This automates design-to-code handoff by delivering structured token data directly from your Figma components.

Can I automate exporting Figma components and rendering nodes as images?

Yes, you can automate exporting Figma components by using the Rube MCP to render specific nodes as images and export assets. This allows your pipeline to programmatically fetch and export visual elements without manual interaction in the Figma UI.

What do I need to connect to Figma before automating file and component tasks?

To automate Figma file and component tasks, you need a connected Rube MCP server, an active Figma session with the figma toolkit enabled, and documented usage of current tool schemas to ensure prerequisite readiness before fetching data.

How does automating Figma comments and version history work with MCP?

Automating Figma comments and version history works by using the Rube MCP to programmatically view, add, and inspect feedback across projects. This manages communication and tracks design iterations directly within your automated pipeline.

What is the best way to list team projects and locate Figma assets quickly?

The best way to locate Figma assets quickly is to automate project browsing via the Rube MCP, which lists team projects and project files. This fetches file data and published components programmatically, bypassing manual Figma searches.

Are there limitations when using MCP to manage Figma design tokens and exports?

The main limitation when using MCP to manage Figma design tokens and exports is its strict prerequisite readiness; without an active Figma session, the figma toolkit, current tool schemas, and a connected MCP server, the automated workflow cannot execute.