Design Principle
Design system docs must support finding, understanding, copying, and judging suitability.
Principle
Design system docs must support finding, understanding, copying, and judging suitability.
Design action
Component pages include purpose, anatomy, props, states, examples, accessibility notes, code entry, and avoid cases.
Examples
Positive example: Component libraries, brand systems, product guidelines, and team development docs. Counterexample: Only screenshots exist without usage or state guidance.
Apply when
Component libraries, brand systems, product guidelines, and team development docs. Users need to judge state, scope, risk, or next action quickly.
Source notes
Source note: Synthesized from GOV.UK, Carbon, Polaris, Atlassian, Design.Systems, Design Systems Repo, and product-pattern libraries. GOV.UK Design System Patterns: https://design-system.service.gov.uk/patterns/ Carbon Patterns: https://carbondesignsystem.com/patterns/ Shopify Polaris: https://polaris-react.shopify.com/ Atlassian Design System: https://atlassian.design/ Design Systems Repo: https://designsystemsrepo.com/
Agent Directive
Component pages include purpose, anatomy, props, states, examples, accessibility notes, code entry, and avoid cases.