规范化的色彩与排版设计系统

制作一张精致的多页面产品设计系统展示板，严格遵循“8px网格”。展示连贯的色彩令牌页面、排版比例页面、间距与圆角令牌、UI组件库、布局模板，以及带清晰标签的组件变体。使用统一的产品界面视觉语言，包括明确的主色、符合可读性的中性色阶、语义化成功/警告/错误颜色、清晰的字体层级、一致的按钮/输入框/卡片/表格模式，以及桌面和移动端响应式示例。所有模块都要明显贴合8px网格，保持一致的页边距、间距、对齐、基线节奏和充足留白。加入简短的令牌名称和状态注释，但文字必须精炼、锐利且清晰易读。采用干净的编辑式文档版面、细微面板阴影、克制的强调色和精确的矢量边缘。不要人物、标志、水印、装饰杂乱、随机填充文字或错位和不一致的变体。

【English Prompt】
Create a polished multi-page product design-system presentation board following an explicit 8px grid. Show a coherent color-token page, typography scale page, spacing and radius tokens, UI component library, layout templates, and carefully labeled component variants. Use one refined product-UI visual language with a clear primary color, accessible neutral ramp, semantic success/warning/error colors, readable type hierarchy, consistent button/input/card/table patterns, and responsive desktop/mobile examples. Make every module visibly snap to the 8px grid with consistent gutters, spacing, alignment, baseline rhythm, and generous whitespace. Include small annotations for token names and states, but keep text concise, sharp, and readable. Use clean editorial documentation, subtle panel shadows, restrained accent color, and precise vector-like edges. No people, no logos, no watermark, no decorative clutter, no random filler text, and no misaligned or inconsistent variants.

可直接复制使用 · [方括号] 处按需替换成你的内容