design-spec-md

原文涵盖的主题

• Design Spec in Markdown
• Quick Start
• When to Use
• Best Practices
• Goal
• Audience
• Tokens
• Components and States

Precise Markdown specs that make agents understand design exactly. Any UI task given to an AI agent Landing pages, dashboards, forms, mobile screens Retheme or redesign of existing apps Handoff between human and agent Design reviews and pre-delivery checks One sentence, one measurable outcome State the user job, not the component list Add a time or quality bar when possible No marketing fluff in the goal Device, context, constraints (one-handed, sunlight, keyboard-only) Accessibility needs up front What the user already knows (skip re-explaining) Edge users: zoom 200%, slow network, old phones Reuse existing semantic tokens, never hard-code hex Map roles: background, surface, foreground, primary, border, ring Typography: font, sizes, line-height, weights Spacing and radii from the scale, no magic numbers List components with props and variants Every interactive element needs default/hover/focus/disabled/error/empty/loading Focus visible for keyboard, 44px+ touch targets Reduced motion respected, no bounce easing Breakpoints 375/768/1024/1440 with behavior per breakpoint Contrast 4.5:1 minimum for text Meaning never by color alone Chips and badges reflow, long tokens wrap safely 1.

这里只展示节选，请以完整原文和当前要求为准。