design-system-skills

Plugin design-system-skills from marketplace design-how in arla6ka/design.how. Commands read from the repo's manifest — 6 days ago.

Skills (11)

• build-design-system

  Use when someone wants a design system built from the UI an app already ships, or one phase of it, such as "extract tokens from the app", "add states to our Button", "replace the hardcoded colors with tokens" or "start a design system". Moving screens onto an existing system's components is migrate-

• component-docs

  Use to write one component's documentation entry from its code, stories and real call sites, such as "document the button", "write docs for Select", "what states does Toast have", or usage rules for a new or changed component. Not for foundations or pages that span components, which no skill here wr

• design-system-boss

  Use for vague whole-app design system asks on an app that already ships UI, such as "our UI is a mess, fix it", "we need a design system", "we hardcode colors everywhere", "make the buttons consistent" or "check the app before I ship". One named screen goes to ui-review, one component to component-d

• migrate-design-system

  Use when an app has to move onto a design system that already exists, such as "migrate the app to our design system", "move every screen onto the new components", a rollout, or an adoption audit. Not for making the system or for swapping raw values for tokens, which are build-design-system.

• token-mapping

  Use to report how hardcoded style values on a page, file or diff map onto a project's existing design tokens, such as "are we using our tokens here", "which hardcoded colors map to which tokens", a token audit or planning a token migration. It never edits. Replacing the values is build-design-system

• ui-review

  Use to critique a screen, flow, prototype or running build, accessibility included, and rank what is broken, such as "check this page before I ship", "is this flow ready", "is it accessible", keyboard or screen-reader checks, "it feels off on my phone" or "it feels janky". Not for token compliance,

• glaze

  Glaze design system rules for this project's UI. Use when building or changing any screen, component, form or style, when porting an existing screen onto Glaze, or when checking UI against Glaze.

• lime

  Lime design system rules for this project's UI. Use when building or changing any screen, component, form or style, when porting an existing screen onto Lime, or when checking UI against Lime.

• quartz

  Quartz design system rules for this project's UI. Use when building or changing any screen, component, form or style, when porting an existing screen onto Quartz, or when checking UI against Quartz.

• sodium

  Sodium design system rules for this project's UI. Use when building or changing any screen, component, form or style, when porting an existing screen onto Sodium, or when checking UI against Sodium.

• ai-lights

  Builds a glowing UI component in React and CSS in which one body morphs between four agent-tool surfaces (a workflow chain, a progress row, a terminal and a prompt bar) and each change is announced by a pulse of rainbow light running round its rim, made from a conic gradient on registered custom pro