skills.rest
tuyoogame
tuyoogameOFFICIAL
Explore all skills by this author →
WebsiteGitHub

Figma

Query Figma design files to extract structure, components, and styles.

124|12|Updated Apr 5, 2026
Search Tags:#design#ui#api#components#figma#export#styles
One-click install
npx skills add https://github.com/tuyoogame/tyclaw.rs --skill figma-tuyoogame
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: Figma
Source: https://github.com/tuyoogame/tyclaw.rs/tree/main/workspace/skills/data/figma
Command: npx skills add https://github.com/tuyoogame/tyclaw.rs --skill figma-tuyoogame

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Figma file analysis helps teams quickly grasp file structure, export screenshots, and review components and styles without editing the source.

Core Features & Use Cases

  • Read-only querying of Figma design files to reveal pages, frames, and components.
  • Export node screenshots and access published components and styles for review and prototyping.
  • Use Case: A design reviewer inventories a file's components and styles to prepare a design handoff and asset pack.

Quick Start

Invoke the Figma tool to inspect a design file and export a screenshot of the home page.

Frequently Asked Questions about Figma

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

FAQPage Schema
How do I query a Figma file to extract its structure and components?▼

Query Figma design files by providing a file-key or URL to the read-only API tool, which extracts pages, frames, and components without modifying the source file. You can also target specific nodes using node-ids for granular inspection.

Can I export screenshots of specific frames from a Figma design file?▼

Export node screenshots from Figma files by specifying node-ids and depth parameters to target exact frames or components. The tool script retrieves visual captures of the selected nodes for review and prototyping.

What is needed to review published Figma components and styles for a design handoff?▼

Reviewing Figma components and styles requires the file's file-key or URL to access published elements via the read-only API. This reveals the file's complete structure, enabling design reviewers to inventory assets and prepare handoff packs.

Does the Figma API tool support read-only access without editing the source design?▼

The Figma API tool operates strictly read-only, querying design files through a Python script to inspect structure, export screenshots, and review components and styles. It guarantees the source file remains unmodified during analysis.

How do I target specific nodes in a Figma file for screenshot export?▼

Target specific Figma nodes for export by passing node-ids and a depth parameter to the API tool script. This constrains the query to exact design elements, returning screenshots and structural data only for the specified nodes.

Are there limitations when querying Figma designs through the API for file structure?▼

Figma design querying is limited to read-only operations via the API tool script, meaning it cannot edit or update source files. It extracts structure, components, styles, and node screenshots but does not support modifying the original design.

Related Skills

Explore More Design & Creative Skills→
zangjeicyzangjeicy

canvas

Retrieve course enrollments and assignment details from the Canvas LMS REST API.

Community
Intermediate
YanCheng-goYanCheng-go
3

figma-to-code

Translate Figma designs into React and Tailwind components.

Community
Advanced
johnlindquistjohnlindquist
24

figma

Extract design tokens, components, and styles from Figma files.

Community
Intermediate
eXodeseXodes
3

refactoring-ui

Apply Refactoring UI principles to diagnose and improve design clarity, spacing, color, and hierarchy.

Community
Intermediate