Skills
.Work. You
Rest

figma-design-system

Community

Build and codify Figma design systems with ease.

Design & Creative#design system#Figma#UI consistency#component inventory#token extraction
AuthorbRRRITSCOLD
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill addresses the challenge of manually building and maintaining design systems in Figma, then extracting and codifying them for code consumers.

Core Features & Use Cases

  • Automated Design System Creation: Directly build design systems in Figma using the official Figma MCP.
  • Token Extraction: Extract and codify design tokens from Figma into tokens.json for frontend engineers.
  • Component Inventory: Provides a complete component inventory for frontend development.
  • Use Case: Ideal for teams working on large-scale UI projects that require consistency across components and designs.

Quick Start

Build a design system in Figma using the 'figma-design-system' skill.

Dependency Matrix

Required Modules

None required

Components

scriptsreferencesassets

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: figma-design-system
Download link: https://github.com/bRRRITSCOLD/compainy/archive/main.zip#figma-design-system

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 620,000+ vetted skills library on demand.