skills.rest
redongreen
redongreenCOMMUNITY
Explore all skills by this author →
GitHub

create-api

Generate API overview specifications for Figma components using MCP tools.

236|32|Updated Jan 23, 2026
Search Tags:#automation#design system#figma#component documentation#properties#api spec
One-click install
npx skills add https://github.com/redongreen/uSpec --skill create-api-redongreen
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: create-api
Source: https://github.com/redongreen/uSpec/tree/main/.cursor/skills/create-api
Command: npx skills add https://github.com/redongreen/uSpec --skill create-api-redongreen

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill automates the creation of API overview specifications directly within Figma, eliminating the need for manual documentation of component properties.

Core Features & Use Cases

  • Automated API Documentation: Generates detailed tables for component properties, values, defaults, and required status.
  • Sub-component Documentation: Supports documenting properties of nested or compound components.
  • Configuration Examples: Provides practical examples of how to use component properties with live previews.
  • Use Case: When designing a new UI component, use this Skill to instantly generate a comprehensive API specification that developers can use to understand and implement the component correctly.

Quick Start

Use the create-api skill to generate an API spec for the 'Button' component using the provided Figma link.

Frequently Asked Questions about create-api

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

FAQPage Schema
How do I generate API documentation for Figma components automatically?▼

Generating API documentation for Figma components automatically involves extracting component structure, variant axes, and boolean toggles via Figma's API. This data populates predefined templates to document properties, values, and defaults directly within Figma.

What is component API documentation in a design system?▼

Component API documentation in a design system specifies component properties, values, defaults, and required status. It includes configuration examples and live previews to guide developers in implementing UI components correctly.

Can I document sub-component properties within Figma?▼

Yes, you can document sub-component properties within Figma. API spec generation supports documenting properties of nested or compound components, capturing their variant axes and instance swap properties alongside the main component.

Does Figma MCP support extracting variant axes for API specs?▼

Yes, Figma MCP tools support extracting variant axes for API specs. They leverage Figma's API to pull component structure, variant axes, boolean toggles, and instance swap properties to populate documentation templates.

What's the best way to document boolean toggles and instance swap properties in Figma?▼

The best way to document boolean toggles and instance swap properties in Figma is to automate extraction via Figma's API using MCP tools. This processes component data and populates predefined templates with property values, defaults, and configuration examples.

Why are my Figma component properties not showing in API specs?▼

If Figma component properties are not showing in API specs, the extraction may have failed to read component structure, variant axes, or boolean toggles via Figma's API. Ensure the component link is correct and MCP tools have proper access permissions.

Related Skills

Explore More Design & Creative Skills→
redongreenredongreen
236

create-property

Generate visual property annotations for Figma components with variant and variable mode support.

Community
Advanced
dylantarredylantarre
38

component-docs

Generate Markdown component API docs from TypeScript interfaces.

Community
Intermediate
manutejmanutej
61

figma-design

Automate Figma design workflows for plugin development and design-system management.

Community
Advanced
sauvalasauvala

playground

Create single-file HTML playgrounds for interactive design and code experimentation.

Community
Intermediate