quantumquirkxyz Contract
- Input: problem or task defined by the skill body.
- Output: Markdown artifact or structured result with completion criteria met.
- Side effects: none (design/review/documentation only unless explicitly stated).
- Dependencies: none (self-contained unless linked to other skills).
- Stop condition: all process steps completed; artifact saved; criteria checked.
- Risk: low.
- Boundary: produces reasoning or documentation artifacts; does not modify external systems unless explicitly instructed.
Design System
Use this skill when UI work starts to repeat and needs a shared system rather than one-off styling. It should define the reusable tokens, components, and usage rules that keep the frontend coherent as it grows.
Contract
- Input: UI requirements, component inventory, and brand context.
- Output: token guidance, component guidance, and usage rules.
- Scope: design the shared system, not a single page.
- Rule: prefer a small set of reusable tokens over ad hoc styling.
- Rule: make reuse rules explicit so callers know what belongs in the system.
- Rule: keep component contracts stable enough for multiple surfaces.
Steps
- Find repeated UI patterns and naming collisions.
- Define the minimum token set that carries the brand.
- Identify which components should be shared and which should stay local.
- Write the rules that keep the system coherent over time.
Completion criteria
- the reusable tokens are named
- the shared components are named
- the usage rules are explicit