Extract design tokens from websites
extract-design-systemskillsetup L2★0
arvindrk/extract-design-system ↗What it does
Extract tokens, components, and patterns from design tools into code
Best for
Automating design-to-code pipeline so engineers and designers stay in sync.
Inputs
- · Design file (Figma/Pencil)
- · Export target (CSS/JSON/TS)
Outputs
- · Design system tokens
- · Component specs
Requires
- · Figma API
- · Pencil MCP
Preconditions
- · Design file is authoritative
- · Export format defined
Failure modes
- · Design changes don't auto-sync to code
- · Token naming conflicts
Trust signals
- · Token extraction schema
- · Component spec format