用途：为 Web UI 设计并实现深色主题，覆盖配色、层级、组件与切换逻辑，避免简单反色带来的刺眼与不可读问题。
主要能力：1) 以亮度表达层级，基面、表面、浮层、遮罩逐级变亮，而非依赖阴影。2) 色彩饱和规则：深色下浅度提高 10–15%、彩度降低 15–25%，通过 oklch 变量派生而非新建色板。3) 文本对比层级：主文本白色约 87–90% 不透明度，次级约 60–70%，禁用 38%；需阅读内容保持 4.5:1。4) 边框用半透明白，装饰 6–8%，表单控件需 3:1。5) 图片降亮约 0.85 并提供深色遮罩；图标用 currentColor；深浅两套 Logo。6) color-scheme 属性与 meta 保证原生控件、滚动条正确。7) 三种实现方式：prefers-color-scheme 系统偏好、data-theme 属性加类切换（含 localStorage 与系统监听）、Tailwind dark: 变体。8) 内联阻塞脚本防主题闪烁，SSR 加 suppressHydrationWarning。9) 提供输入框、卡片、按钮、下拉、表格等组件模式。10) 切换过渡使用临时类，尊重 prefers-reduced-motion，可选 startViewTransition；切换按钮保持 aria-pressed 同步。
使用方式：先加载设计上下文（.agents/design-context.md 或 tailwind.config.*、:root 变量），缺失时使用默认值并提示。将令牌映射为 CSS 变量后统一引用；Figma URL 可用 Figma MCP 获取并覆盖。切换逻辑建议三态（浅色/深色/跟随系统）。完成后用 Playwright 截图移动与桌面宽度检查溢出、层级与对比。
适用场景：Web 应用、组件库、仪表盘等需要暗色模式的界面。
限制：资料未提供具体收费、平台支持范围与效果承诺；色值中的 indigo/gray 为占位符，需替换为项目令牌。