design-system-extraction-code

Extract design tokens from visual audits or source code by running this Skill's Python automation to parse inputs and generate standardized JSON files for colors, spacing, and typography. It handles partial inputs and flags gaps for reporting.

Automating design system documentation from a codebase is best handled by extracting component definitions and design tokens to JSON, supporting standardized documentation site generation and iterative design system development.

Yes, you need Python3 and the jsonschema dependency to generate design tokens and component definitions, as the Skill uses Python automation to process visual audits or source repositories and validate output.

Yes, you can identify UI components from a Figma visual audit by providing the audit data to the Skill, which detects and documents components including variants, layouts, and accessibility info into a components.json file.

When extracting a design system from partial inputs, the Skill processes available visual audit or source data and automatically flags missing information, ensuring comprehensive reporting on gaps for iterative development.