← all plugins

Create Design System Documentation

curated by SkillMD · plugin · 8 skills

Generate component specifications, pattern library entries, and design system documentation for UI consistency.

Install the whole plugin (CLI)
npx skillmds add owl-listener/component-spec npx skillmds add owl-listener/pattern-library npx skillmds add owl-listener/documentation-template npx skillmds add owl-listener/naming-convention npx skillmds add drnabeelkhan/maxim-design-system npx skillmds add pwdev-solucoes/design-system npx skillmds add auto-skiller/design-system npx skillmds add moonklabs/design-md
⬇ Download

Skills in this plugin

  1. component-spec · owl-listener
    Creates detailed component specifications for design systems, covering anatomy, variants, states, accessibility, and usage guidelines.
    1.7k
    repo stars
  2. pattern-library · owl-listener
    Structure a pattern library entry with problem context, solution pattern, usage examples, and related patterns.
    1.7k
    repo stars
  3. documentation-template · owl-listener
    Generate structured documentation templates for components, patterns, or guidelines within a design system.
    1.7k
    repo stars
  4. naming-convention · owl-listener
    Establish clear naming conventions for design assets, components, and tokens to make design systems predictable and maintainable.
    1.7k
    repo stars
  5. maxim-design-system · drnabeelkhan bundle
    Builds and governs design systems with a three-layer token architecture, component specs, and design-to-code handoff, including slide generation.
    2
    repo stars
  6. design-system · pwdev-solucoes
    Documents, 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.
    2
    repo stars
  7. design-system · auto-skiller bundle
    Creates 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.
    1
    repo stars
  8. design-md · moonklabs
    Generates 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.
    0
    repo stars