extract-design-mdlisted

# Extract Design System from Frontend Code Analyze frontend source code to extract a comprehensive design system document (DESIGN.md) that captures the project's visual language — colors, typography, spacing, component patterns, and layout principles — directly from the source files, without needing to build or render the application. ## Why This Exists The `design-md` skill works from rendered HTML. But often you have a codebase and want to understand its design system before you can even run the app — maybe dependencies are missing, the build is broken, or you just want a quick audit. This skill reads the source files themselves: stylesheets, component files, theme configs, and Tailwind setups. It's faster and works anywhere. ## When to Use - User has a frontend codebase and wants to extract or document its design system - User wants to migrate a project's visual identity into Stitch - User asks to "audit the styling" or "understand the design language" of a repo - User wants to create a DESIGN.md from existing source code - The app can't be built/rendered but the source is available - User wants to unify or reconcile inconsistent styles across a codebase ## Prerequisites - Access to the frontend project's source directory - No build or runtime dependencies needed — this skill reads source files only --- ## Workflow ### Phase 1: Project Discovery Start by understanding what you're working with. This determines which extraction patterns to use. #### 1. Detect the