Create Design System Documentation
Generate component specifications, pattern library entries, and design system documentation for UI consistency.
Skills in this plugin
8- ▌ Component Spec · owl-listenerCreates detailed component specifications for design systems, covering anatomy, variants, states, accessibility, and usage guidelines.
- ▌ Pattern Library · owl-listenerStructure a pattern library entry with problem context, solution pattern, usage examples, and related patterns.
- ▌ Documentation Template · owl-listenerGenerate structured documentation templates for components, patterns, or guidelines within a design system.
- ▌ Naming Convention · owl-listenerEstablish clear naming conventions for design assets, components, and tokens to make design systems predictable and maintainable.
- ▌ Maxim Design System · drnabeelkhan bundleBuilds and governs design systems with a three-layer token architecture, component specs, and design-to-code handoff, including slide generation.
- ▌ Design System · pwdev-solucoesDocuments, standardizes, and governs a Vue 3 + shadcn-vue design system, including component documentation templates, patterns for forms, empty states, loading states, and feedback, plus a consistency checklist and conventional commit conventions.
- ▌ Design System · auto-skiller bundleCreates and manages design token systems with three-layer architecture, generates CSS variables, validates token usage, and produces brand-compliant slide presentations with Chart.js and contextual decision logic.
- ▌ Design Md · moonklabsGenerates a DESIGN.md file conforming to the Stitch (Google Labs) design.md alpha spec, auto-discovering design tokens and components, then emitting YAML frontmatter and eight standard markdown sections.