design-system is agent-read markdown (skill) from vmobifystudio/app-dev-team: Use when defining or extending design tokens and the shared component library — by product-designer when writing docs/13-design-tokens.md and docs/14-components.md, and by any IC about to add a component. Triggers the moment a value would be hardcoded instead of named, or a one-off component would be created instead of composed..
Indexed from public GitHub and served as immutable, content-addressed versions. Install it pinned to an exact SHA-256 with the mdr CLI, and every file is verified against the hash recorded here before it reaches your agent. The deterministic audit below grades the latest version, and the same file always earns the same grade.
What the file says
# Design system
A design system is not a document, it is a **constraint that holds at build time**. Tokens nobody is
forced to use are a colour list.
## Three layers, in this order
1. **Primitive** — the raw values. `blue-600 #2563EB`, `space-4 16`, `dur-fast 150ms`. No screen
ever references a primitive directly.
2. **Semantic** — what it means. `text/primary`, `surface/elevated`, `semantic/error`,
`motion/enter`. Screens reference these and only these.
3. **Component** — what a component uses. `button/primary/background` → `semantic/action`.
Skipping layer 2 is the failure: a dark mode, a rebrand or a contrast fix then edits every screen.
## The rules
- **A hardcoded colour, spacing, radius, duration or font size in a screen is a defect**, not a
style preference. Name it or use the token that already exists.
- **Every semantic token names its dark-mode value at the same time.** A token added light-only is a
dark-mode bug already merged.
- **A new component needs a reason the existing ones cannot compose it.** Write the reason in
`docs/14-components.md`. "It looked different in the mock" is not one.
…
Pin to a label to follow the author's releases, or to a sha256 to freeze the exact bytes forever. Either way the resolved hash is written to mdr.lock, and mdr install reproduces it on any machine.
GET https://markdownregistry.com/api/v1/artifacts/art_d225i7mdye2lzjyh
GET https://markdownregistry.com/api/v1/resolve?ref=vmobifystudio/app-dev-team/design-system
GET https://markdownregistry.com/api/v1/blob/f5bd945b638cb6ab8aab5f1f3aafd2e2d86311e6cebc94b1afb098a5c4986808
Your agent does the legwork. You hear about the deals worth your word. Hand yours the standing instructions at modelranch.com and it joins the network that reads files like this one.
vmobifystudio/app-dev-team · skills/accessibility-gate/SKILL.md · Use as a pass/fail gate on any diff with a user-facing surface — by code-reviewer during review, by qa-engineer during…
vmobifystudio/app-dev-team · skills/agent-isolation/SKILL.md · Use before spawning any agent that writes files, and by every developer/fixer agent as its first and last action. Gives…
vmobifystudio/app-dev-team · skills/architecture-builder/SKILL.md · Use to produce the technical architecture doc and engineering principles for a mobile app. Used primarily by the CTO…
vmobifystudio/app-dev-team · skills/board-doctor/SKILL.md · Use to validate docs/31-board.md before spawning any agent, and to verify a developer's "DONE" claim before moving a…
vmobifystudio/app-dev-team · skills/brownfield-onboarding/SKILL.md · Use when pointing the team at an EXISTING, already-built app instead of a blank project — detects the stack…
vmobifystudio/app-dev-team · skills/business-model/SKILL.md · Use when deciding or revisiting how the product makes money — pricing, tiers, trial shape, ad load, unit economics — by…
vmobifystudio/app-dev-team · skills/content-design/SKILL.md · Use when writing or reviewing any string a user reads — labels, buttons, empty states, errors, permission prompts…
vmobifystudio/app-dev-team · skills/context-preflight/SKILL.md · Run before changing a repository to verify branch, worktree, ticket, dependencies, source-of-truth documents, and…
vmobifystudio/app-dev-team · skills/database-migration/SKILL.md · Use before changing any persisted schema — by backend-developer on a server store, by web-developer on a client or…
vmobifystudio/app-dev-team · skills/defect-hunting/SKILL.md · Use when reviewing code, auditing an app, writing a guard rule or test, or certifying any threshold/constant/formula…
cbrock84/headcount · plugins/product/skills/design-system/SKILL.md · Builds and maintains the design system a product is assembled from — tokens for color, type, spacing and elevation…
microsoft/power-platform-skills · plugins/mobile-apps/skills/design-system/SKILL.md · Creates the Tamagui brand system for an Expo/React Native Power Apps mobile app, including design-system.md, tokens.ts…
rampstackco/claude-skills · skills/design-system/SKILL.md · Build or audit a design system including component library, design tokens, naming conventions, contribution model, and…
borghei/claude-skills · markdown-html/design-system/SKILL.md · Design tokens, light/dark theming, and WCAG contrast validation for HTML documents and decks, compiled into one…
akillness/jeo-skills · .agent-skills/design-system/SKILL.md · Define or refactor a shared frontend UI system before polishing one screen at a time. Use when the user needs token…
fusengine/agents · plugins/design-expert/skills/design-system/SKILL.md · Use when starting any design task, before choosing or auditing a color/type/spacing token or writing design-system.md —…
