Dark mode
暗色模式
主题由根元素的 data-theme 属性决定。语义 token 在暗色作用域内替换值即可切换全站，无需遍历 dark: 类名。
实时切换
右上角同款切换器使用 View Transitions 圆形揭示明暗。
点击切换整个文档站的主题
就地作用域
暗色 token 绑定在 data-theme 属性上，任意子树都可单独切换。下方两张卡片始终分别显示亮色和暗色。
Light
卡片标题
次要描述文字使用 color-muted。
主按钮次按钮
Dark
卡片标题
次要描述文字使用 color-muted。
主按钮次按钮
0 闪烁（anti-FOUC）
首屏脚本在 React 水合前设置 data-theme，并读取本地偏好或系统配色。同步 color-scheme 后，原生滚动条与回弹区也不会闪出错误底色。
代码切换
可在任何位置命令式读写主题。
// 读取 document.documentElement.dataset.theme; // "light" | "dark" // 写入，持久化由 useTheme 或切换器负责 document.documentElement.dataset.theme = "dark";