Agent Skills: design-system-extractor
Extract and document a frontend repo's foundation design system (fonts, colors, transitions, layout, spacing, component styles) into a readable DESIGN-SYSTEM.md reference. Use when the user says "extract the design system", "document our design tokens", "what fonts/colors does this app use", "build a design system reference", or "audit our styling".
ID: tomlord1122/tomtom-skill/design-system-extractor
Install this agent skill to your local
Skill Files
The files that make up design-system-extractor.
More agent skills
- remove-ai-slopsRemoves AI-generated code smells from branch changes or an explicit file list behind regression tests, including junk tests (prose pins, source greps, copied inventories, mock echoes), each proven by its class's rule before a cut. Use when the user asks to clean up, deslop, remove AI-slop patterns, or prune tests from recent changes.
- react-state-managementMaster modern React state management with Redux Toolkit, Zustand, Jotai, and React Query. Use when setting up global state, managing server state, or choosing between state management solutions.
- browserwing-adminManage and operate BrowserWing — an intelligent browser automation platform. Install dependencies, configure LLM, create/manage/execute automation scripts, use AI-driven exploration to generate scripts, browse the script marketplace, and troubleshoot issues.
- aur-publishPublish voxtype to AUR. Updates PKGBUILDs, fills checksums from the CI-signed SHA256SUMS.txt, and pushes to AUR. Covers the stable packages (voxtype, voxtype-bin) and the rc channel (voxtype-bin-rc). Use after a GitHub release is published.
- cpp-proWrites, optimizes, and debugs C++ applications using modern C++20/23 features, template metaprogramming, and high-performance systems techniques. Use when building or refactoring C++ code requiring concepts, ranges, coroutines, SIMD optimization, or careful memory management — or when addressing performance bottlenecks, concurrency issues, and build system configuration with CMake.
- openspec-continue-changeContinue working on an OpenSpec change by creating the next artifact. Use when the user wants to progress their change, create the next artifact, or continue their workflow.