用途：把设计系统以 HTML 形式呈现，便于团队参考与评审。适用于两类场景：一是从仓库提取 design tokens 整理成 reference，二是把某个组件的所有 variant 平铺在一张 contact sheet 上 review。
主要能力：范式一为设计系统参考，空间形状为 4 个区域加底部组件展示行，每个 token 必须可见——颜色显示色块、hex 与变量名，字号用真实渲染字样，间距用真实宽度横条，圆角与阴影用真实渲染卡片。可直接使用模板 ../../templates/design-tokens.html，含 4+4+4 配色 swatches、6 级字号 scale、8 级间距、4 级圆角、3 级阴影、核心组件展示行及 light/dark 切换；修改时把 hex 值、变量名前缀、字号与间距数字换成项目自己的 tokens 即可。范式二为组件变体陈列，空间形状为 3×N 网格，每格一个变体，标签 A/B/C/D 在卡片左上，底部写 best for，可加 prop slider（padding/radius/shadow）让 reviewer 实时调整，无独立模板。
使用方式：按用户说法选择范式，如“把我们的 design tokens 整理成一份 reference”或“review 一下我们用了哪些颜色/字号”用设计系统参考；“show me all variants of Card / Button”用组件变体陈列。
限制与原则：token 永远显示具体值，不要只写变量名；组件变体保持 6 个左右，过多不便评审；每个 variant 必须有 best for，说明何时使用；slider 必须真实影响渲染且所有变体同时变化。资料未提供收费、平台与效果信息。