home/categories/design/natdexterra-generate-design-system-skill-md
designcontent-media

generate-design-system

Build or extend design systems in Figma — create components with proper variable bindings, validate token coverage, and enforce quality patterns following a structured phased workflow. Use when the user says 'create design system', 'build DS in Figma', 'generate component library', 'set up tokens in Figma', 'create variables and components', 'audit my design system', or wants to push a design system from code to Figma. Also use when creating components in a file that already has variables and text styles — the skill ensures proper binding, per-component validation, and spec documentation. Works from scratch, from an existing codebase, or by auditing and extending an existing Figma file. Does NOT implement Figma designs as code — use figma-implement-design for that. Does NOT create individual screens — use figma-generate-design for that.

natdexterra
maintainer
natdexterra
업데이트됨 4/6/2026
스타
30
포크
2
quick start

Installation and usage

Build or extend design systems in Figma — create components with proper variable bindings, validate token coverage, and enforce quality patterns following a structured phased workflow. Use when the user says 'create design system', 'build DS in Figma', 'generate component library', 'set up tokens in Figma', 'create variables and components', 'audit my design system', or wants to push a design system from code to Figma. Also use when creating components in a file that already has variables and text styles — the skill ensures proper binding, per-component validation, and spec documentation. Works from scratch, from an existing codebase, or by auditing and extending an existing Figma file. Does NOT implement Figma designs as code — use figma-implement-design for that. Does NOT create individual screens — use figma-generate-design for that.

설치
$ install --globalskills.sh
사용법

설치 후 터미널에서 다음 명령을 실행하여 이 스킬을 사용할 수 있습니다:

skills use generate-design-system