Figma DESIGN.md Generator

Skill by ara.so — Design Skills collection.

A Figma plugin that extracts local style guidelines, variables, and component families from Figma files and generates DESIGN.md and SKILL.md files. These outputs provide AI tools (Claude Code, Cursor, Codex) with structured design-system blueprints for building consistent interfaces.

What It Does

The plugin reads Figma's local styles and variables—colors, typography, spacing, radius, effects, grids, and component sets—and converts them into editable markdown files following the TypeUI DESIGN.md format.

Key capabilities:

• Auto-extracts color tokens (paint styles + variables)
• Auto-extracts typography tokens (text styles + scales)
• Auto-extracts spacing, radius, motion tokens
• Auto-extracts effect styles (shadows, blur)
• Auto-extracts grid styles and component families
• Generates human-editable DESIGN.md (reference documentation)
• Generates AI-optimized SKILL.md (agent instructions)