dsh-theme-atlas:六套材质皮肤,一套 token 引擎

前言

DeepSeek Harness(DSH)的 Web 界面有一套 --dsw-* 设计 token,浅色与深色由壳层自身的 Appearance 控制。若只想换一套配色或背景气质,而不改布局、不挂图片、也不依赖 host 上的 webServer,常见做法是手写 CSS 或零散覆盖变量,维护成本高,且很难保证明暗两种模式下语义一致。

下面介绍社区插件 dsh-theme-atlas(维护者 John-20260101,分类:趣味换装)。它是一个主题包而非单色换肤:六套「材质」皮肤共用同一套推导规则,在应用内切换,运行时纯 CSS,不加载位图、不注册插件自有路由。

这是什么

Atlas 面向 DSH Web GUI,提供六套材质向皮肤(墨玉 Ink Jade、赤陶 Terracotta、极光 Aurora、深海 Abyss、樱雾 Sakura Mist、素笺 Paper)。每套皮肤为每种外观声明六个输入色;引擎据此推导 Web shell 使用的 119 个 --dsw-* 别名 token,并做对比度测量。六皮肤 × 明暗两种外观共十二套调色板,语义规则一致,便于在浅色与深色下保持可读性。

仓库以 MIT 许可证发布,当前 package 版本为 0.3.0。原先仓库内的三套乐山摄影皮肤已拆到独立插件 dsh-theme-leshan,本包不再包含。

核心功能

六套材质皮肤

皮肤 材质意象 强调色(浅 / 深) 正文对比度(浅 / 深)
墨玉 Ink Jade 和田青玉 · 宣纸 #2E6B57 / #74C3A2 15.6:1 / 16.0:1
赤陶 Terracotta 未上釉陶土 · 砂 #AE5229 / #E08C5F 14.9:1 / 15.0:1
极光 Aurora 极地冰晶 · 夜光 #16758F / #55D6D2 15.5:1 / 16.3:1
深海 Abyss 深海蓝 · 微光 #1B58B4 / #5B8DEF 15.9:1 / 16.1:1
樱雾 Sakura Mist 薄樱 · 雾面 #B1436B / #E78BA8 15.1:1 / 15.8:1
素笺 Paper 无涂布纸 · 墨 #1F1F1F / #E8E8E8 17.9:1 / 16.9:1

完整 token 表与测量细节见仓库 docs/palettes.md。

运行时行为(三层)

加载后插件主要做三件事,卸载时会移除属性、自定义属性、样式、切换条与 token 层,页面回到壳层默认绘制;不写 host 配置、不落盘、不发网络请求。

  1. Token 层:调用 ctx.theme.overrideTokens('dsh-theme-atlas', layer),将每个 --dsw-* 映射为 { light, dark } 对;换皮肤即替换该层。若 shell 无 theme 服务,则回退到带相同取值的 scoped 样式表。
  2. 签名 wash:插件自有样式表在 html[data-dsh-atlas] 下添加页面渐变、选区色与 focus ring,不改布局、不加载图片。
  3. Skin rail:右下角 shadow DOM 面板,用于切换皮肤,键盘可达;随插件卸载移除。

兼容与环境

  • DSH Web 0.2.0-rc.1 … 0.2.x(package.json 中 dsh.engines 为 >=0.2.0-rc.1 <0.3.0-0)。
  • 官方 Desktop 与 dsh web 均可;浏览器需支持 color-mix()(Chromium 111+、Safari 16.2+)。
  • 不需要 host 服务:有无 webServer / theme 服务均可应用主题(无 theme 服务时仍走 fallback 层)。

安装与启用

Web profile 下任选其一(命令来自仓库 README):

# 直接从 GitHub 安装
dsh plugin --profile web add github:John-20260101/dsh-theme-atlas

# 或使用预构建 tarball(无需 build)
dsh plugin --profile web add https://github.com/John-20260101/dsh-theme-atlas/releases/latest/download/dsh-theme-atlas.tgz

Desktop 端:插件 → 添加插件,粘贴 github:John-20260101/dsh-theme-atlas,启用后若 shell 提示则重载窗口。插件为常规 bundle(package.json 声明 dsh.bundle 与 cordis.patch.yml),client.js 已预构建,安装侧无需执行 build。

典型用法

切换皮肤

  1. 点击窗口右下角的 Atlas 药丸按钮,或按 Alt+K 循环切换。
  2. 当前选择保存在浏览器本地:localStorage 键 dsh.theme-atlas.skin;不同浏览器可各自使用不同皮肤。
  3. 界面上的「隐藏此钮」会隐藏药丸(localStorage 键 dsh.theme-atlas.rail);Alt+K 仍可用,清除该键可恢复按钮。
  4. 浅色 / 深色仍由壳层 Appearance 决定;Atlas 同时提供两套调色板,不会覆盖你的明暗偏好。

适用场景与注意

适合:长期在 DSH Web / Desktop 里工作、希望多套统一推导的材质主题、且不想为换肤部署图片或 host 路由的开发者。

注意:

  • 插件在 当前 DSH 进程的权限 下运行;安装前建议浏览 GitHub 源码 与 MIT 许可证,确认符合你的环境策略。
  • 仓库 assets/ 下的截图与 key art 仅用于文档与目录展示,运行时皮肤不读取这些位图。
  • DSH 社区插件目录为独立站点 skillhub.cn,与 DeepSeek / 幻方无官方从属关系;生态上 DSH 强调「一切皆插件」,本包是其中的 Web 端趣味换装类扩展。

若需自行改皮肤或贡献,可在克隆后于仓库根目录执行 npm install 与 npm run verify(含 token 完整性与 WCAG 门禁);新增皮肤只需在 src/skins.mjs 增加一行并跑 verify。

结尾

dsh-theme-atlas 用一套 token 引擎把六组输入色扩展为 119 个 --dsw-* 别名,配合纯 CSS 渐变与 focus/选区样式,在应用内切换十二套调色板,且不依赖 host 路由与运行时图片。查阅说明与安装:

羽毛球分组比赛记分
小程序二维码

欢迎使用《羽毛球分组比赛记分》微信小程序

小夜