dsh-bloom-theme

中文文档
0.22.0发布于 2026/11/03MITTypeScriptES Module零依赖构建来源已验证

Bloom for DSH — 玻璃+莫兰迪主题。12 套 OKLCH 配色(黛蓝/朱砂/桃夭/天青/竹青/赭石/青金/琥珀/落霞/青莲/草色/橙黄),明暗自适应;磨砂玻璃面板默认常开;微动效 + 版本/更新指示。零依赖、TypeScript、WCAG AA。

中文使用文档
文档目录15 节
  1. 📌 桌面端优先 —— 关于 DSH Web UI 的说明
  2. 一句话
  3. 快速开始
  4. 🏆 为什么用它
  5. 截图
  6. 安装
  7. 特性
  8. 设计原理:双轨色
  9. 开发 / 构建(TypeScript)
  10. 常见问题
  11. 贡献 / 开源
  12. 支持
  13. 🧩 DSH 插件全家桶
  14. Star History
  15. License

Bloom for DSH

🌊 Bloom for DSH

12 套莫兰迪中国风主题,配色全部实测达 WCAG AA
Ten Morandi palettes for DeepSeek Harness — every one measured against WCAG AA.

🌸 Bloom for Typora
24 套主题
🌊 Bloom for DSH
12 套配色 · 当前
🛡️ contrast-guard
配色护栏

同一套莫兰迪设计语言:两个宿主的主题,加一个守住它们配色的工具。
One Morandi design language — two themes, and the tool that keeps their colors honest.

npm downloads License

Awesome DSH Plugin WCAG AA zero dependency

中文 | English

把 Bloom(90★ Typora 主题)的莫兰迪质感搬进 DeepSeek Harness。
玻璃 + 莫兰迪:12 套明暗双主题,磨砂玻璃面板,顶栏一键切换, 连 AI 思考的等待也跟主题一起呼吸。

📌 桌面端优先 —— 关于 DSH Web UI 的说明

结论:Bloom 接下来的迭代优先兼容 DSH 桌面端;Web UI 不再主动适配,会逐步淡出。

(0.16.0 及更早的版本是按 DSH Web UI 做的;0.17.0 起适配桌面端——这一版补上了 DSH 0.2.0 的选择器适配,并加了能自动发现这类失效的漂移门禁。)当前桌面应用使用 0.2.1-rc.5 时,切换器的版本提示读取桌面应用版本,而不是内嵌 DSH 包的旧版本;漂移门禁也优先检查本机已安装的桌面版本。

DSH 有了桌面端应用,我自己日常已经切过去了。主题这类东西的价值长在 UI 上——宿主怎么改界面, 配色和玻璃就得跟着长——所以迭代重心跟着挪到桌面端。

具体到你会遇到什么:

你在用会发生什么
桌面端新配色、新动效、视觉修复都优先在这里出。我每天都在用它,界面变了我就会跟。
Web UI保持现状可用,但不再主动适配 DSH Web 端的新变化;DSH 若改了结构导致某处显示不对,我不一定及时跟。

两点补充,省得你按标题猜:

  • 已经装上的版本不会失效。 停的是「跟着新界面继续长」,不是「把你现在能用的弄坏」。
  • 如果你只能用 Web UI,欢迎开 issue 把场景说清楚——真实需求会改变我的判断,这句不是客套。

上一个版本(0.16.0)改了什么:在跑的步骤接管主题色(扫光从灰换成 Bloom 三色); 轮次状态的三色光谱重新接上(DSH 改名后它静默消失了);修浅色模式下消息气泡没画出来的玻璃边; 修子串选择器自叠造成的「盒中盒」与「直角黑块 chip」;撤掉在跑步骤上的胶囊底色——状态不该靠盒子说话。

一句话

给 DeepSeek Harness 的「玻璃 + 莫兰迪」主题。 12 套配色,明暗自适应,顶栏一键切换;面板是真正的磨砂玻璃(半透 + backdrop 模糊 + 玻璃边缘), 配色是低饱和莫兰迪(OKLCH 调色、WCAG AA),全站统一克制的微动效,零运行时依赖,前端 TypeScript 构建。

莫兰迪的气质不在 --accent,在 --accent-rgb。

快速开始

  • DSH 桌面端:应用内「插件管理」安装,重载页面即可 —— 顶栏右上角出现「黛蓝 ▾」按钮,12 套配色、明暗、壁纸都在那里切换。
  • 自建 profile(CLI / 服务器 / Web):dsh plugin --profile <你的 profile> add dsh-bloom-theme,接进 boot graph 后重启 DSH,三步细节见下方安装。

🏆 为什么用它

DSH 原生普通主题插件Bloom for DSH
配色数量1 套3-5 套12 套莫兰迪,明暗各一套
配色依据手工挑色手工挑色OKLCH 感知均匀调色
对比度未声明未声明明暗主色对全部实测 ≥ 4.5:1(WCAG AA)
面板质感实色实色 / 简单半透真磨砂玻璃(半透 + backdrop 模糊 + 玻璃边缘)
切换方式—改配置文件顶栏一键切换,即时生效
动效固定无 / 硬编码跟随主题三色光谱,支持 prefers-reduced-motion
运行时开销—常驻进程 / 依赖零依赖,只注入 CSS 变量

截图

Bloom · Sage (light) 竹青·亮色 —— 磨砂玻璃面板 + 莫兰迪绿,选中会话行以当前主题高亮

12 套配色(亮色):点击任意一套,全站主色 / 背景 / 玻璃 / 动效色相一起切换。

☁️ 黛蓝 Mist
🧧 朱砂 Cinnabar
🌸 桃夭 Petal
🌊 天青 Ripple
🌿 竹青 Sage
🧱 赭石 Stone
🔷 青金 Lapis
🍯 琥珀 Amber
🌅 落霞 Afterglow
🪷 青莲 Lavender

每套都有对应暗色(示例:琥珀·暗色):

Bloom · Amber (dark)

安装

桌面端:在应用内的插件管理里安装、升级。桌面 profile 由应用独占托管, 命令行的 dsh plugin --profile desktop ... 会直接报 profile "desktop" is managed exclusively by the Electron application —— 不是权限问题,是设计如此。

自建 profile(CLI / 服务器 / web)的装法
# 1) 装进你的 profile(profile 名按自己的改)
dsh plugin --profile <你的 profile> add dsh-bloom-theme

# 2) 接进 boot graph:把 "dsh-bloom-theme" 加进
#    ~/.dsh/profiles/<你的 profile>/package.json 的 dsh.profile.bundles 数组

# 3) 重启 DSH

装完刷新页面,顶栏右上角会出现「黛蓝 ▾」主题按钮。点击展开即可在 12 套配色间切换, 下拉底部显示当前版本号;npm 上有更新的版本时会亮一个 ↑ vX 徽标(点它跳 Release 页)。

特性

特性说明
磨砂玻璃面板(默认常开)半透底 + backdrop-filter 模糊 + 玻璃边缘(顶部亮高光 / 半透描边 / 柔和外辉),明暗两档透明度自适应
12 套莫兰迪配色黛蓝 / 朱砂 / 桃夭 / 天青 / 竹青 / 赭石 / 青金 / 琥珀 / 落霞 / 青莲 / 草色 / 橙黄,每套明暗双主题,一键切换
界面语言面板里 中文 / English / Русский 一键切换,没手动选过时沿用原来的浏览器语言自动判断;只换文案,配色与对比度结论一概不动
双轨配色可读轨保对比度(文字/按钮),气质轨专供氛围渐变,两轨分工不混用
微交互动效菜单入场、选中态色条滑入、hover / 按压反馈;统一时长与缓动 token,全站一致
主题色推理动效Deep diving… 以当前主题三色光谱流动,不再固定 DeepSeek 蓝;prefers-reduced-motion 下自动静止
版本 / 更新提示下拉底部显示当前版本;npm 有新版亮「↑ vX」;离版较旧时右下角弹更新横幅,桌面端提示在侧栏「插件」管理中更新
OKLCH 调色 + WCAG AA感知均匀色彩空间,明暗切换不跳变;全部明暗主色对实测 ≥ 4.5:1
零依赖 · 纯 CSS 变量驱动只注入 CSS 变量 + 少量切换逻辑,几乎零运行时开销
不抢占原生控件切换器挂进 DSH 顶栏工具区,与原生按钮并排共存
TypeScript 构建src/ 10 个模块 → node 侧 tsc(ESM)+ 浏览器侧 esbuild(IIFE 单文件);build / deploy / check / preflight 一键脚本

设计原理:双轨色

Bloom 的核心不是「换个颜色」,而是一套莫兰迪质感语言:低饱和的氛围渐变、冷调的发光细线、 长距柔和的投影、克制的圆角与间距。

最容易被忽略(也最容易被做崩)的是双轨色:

  • 可读轨 --bloom-accent —— 被刻意加深过,为了过 WCAG,用在文字 / 按钮 / 选中态;
  • 气质轨 --accent-rgb —— 真正的莫兰迪色(低饱和、发灰),只用于大面积氛围渐变、冷光细线。

原版 14 处渐变全部用气质轨,从不用可读轨铺面。一旦把可读色拿去刷大面积, 桃夭就会从藕粉变成荧光洋红——莫兰迪感就没了。这个插件把两轨完整搬过来, 并在 contrast-guard(同系列工具)里用护栏守住「主色 + 底色」的对比度。

开发 / 构建(TypeScript)

npm install
npm run typecheck    # tsc --noEmit,全量类型检查
npm run build        # typecheck → tsc 出 lib/index.js → esbuild 出 lib/client.js
npm run deploy       # 门禁 → 备份 → 装进桌面端 desktop profile(不过门禁不部署)
npm run rollback     # 起不来时:恢复上一次 deploy 前 / rollback:npm 装回正式版
npm run dsh:status   # 现在装的是哪个版本、是不是开发版、近 24h 崩溃
npm run dev          # build + watch(每次保存先过门禁,不过不同步)
npm run package      # 一键打包(npm pack → .tgz)
npm run check        # 6 组静态闸门 + contrast-guard(每次提交都跑)
npm run preflight    # 发版前检查:版本五方一致 / git 状态 / 收录同步

源码 src/ 是 10 个模块(meta · appearance · palette · tokens · css/ · dom · drag · version · switcher · client),DSH 加载的是 lib/ 里的产物。

构建是双轨的,两侧对模块格式的要求正好相反:

产物谁编译格式为什么
lib/index.js(node 侧)tscESMcordis 的 plugin loader 按 ESM 读它
lib/client.js(浏览器侧)esbuildIIFE 单文件DSH 的插件 client.js 是当 classic script 执行的,出现 import/export 直接语法错误

所以浏览器侧源码可以随意拆模块,产物必须 bundle 回一个自包含文件。

版本号由 release-please 在 release PR 里连同 package.json 一起 bump(靠 src/meta.ts 行尾的 x-release-please-version 标记);scripts/sync-version.mjs 只是本地 dev 的兜底同步,不在发布路径上。改动详见 CONTRIBUTING。

常见问题

主题没生效? 先硬刷新一次(Cmd/Ctrl + Shift + R)。若页面提示 Failed to load plugins, 说明该版本的 client 没能注册,请确认 dsh plugin --profile <name> add 那步无误,或换用最新版。

能自定义颜色吗? 目前通过「变体」选择整套色系;单色自定义在规划中(见 Roadmap)。

贡献 / 开源

  • 加一个新配色:在 src/client.ts 的 PALETTE / VARIANTS / VARIANT_LABELS 里加一项即可, 其余(玻璃、动效、选中态、对比度护栏)全部自动跟上。
  • 请先跑 npm run build && npm run check,确认 contrast-guard 全部达标再提 PR。
  • 欢迎提 issue / PR / 好的想法。

支持

如果 Bloom 让你的 DSH 用起来更舒服,欢迎留下一颗 ⭐,或请我喝杯咖啡(赞助入口在下面的 Sponsor / 面板菜单里也有一处)。

🧩 DSH 插件全家桶

DSH 插件全家桶:主题美化 / 模型管理

🎨 主题美化 · ⚡ 模型管理

一行装齐(只需 Node.js),装完重启 DSH 即可:

PROFILE=<你的 profile>
npx -y @deepseek-ai/dsh plugin --profile "$PROFILE" add dsh-bloom-theme @dsh-plugins/dsh-llm-hub && PROFILE="$PROFILE" node -e 'const f=(process.env.DSH_HOME||require("os").homedir()+"/.dsh")+"/profiles/"+process.env.PROFILE+"/package.json",p=require(f),b=p.dsh.profile.bundles;for(const n of Object.keys(p.dependencies))if(/^(dsh-bloom-theme|@dsh-plugins\/)/.test(n)&&!b.includes(n))b.push(n);require("fs").writeFileSync(f,JSON.stringify(p,null,2)+"\n")'

Star History

Star History Chart for webkubor/dsh-bloom-theme

License

MIT — 借用 / 修改请保留版权声明。配色参考自 typora-Bloom-theme。

版本与发布记录

dsh-bloom-theme 共发布 27 个版本,首次发布于 2026/09/17;过去 12 个月发布了 27 个版本。最新版本附带 npm provenance 构建来源证明,可追溯到公开的 CI 构建记录。

版本发布日期距今
0.22.0latest2026/11/03今天
0.21.12026/11/03今天
0.21.02026/11/03今天
0.20.12026/11/012 天前
0.20.02026/11/012 天前
0.19.22026/10/313 天前

关于 dsh-bloom-theme 的常见问题

dsh-bloom-theme 是什么?

Bloom for DSH — 玻璃+莫兰迪主题。12 套 OKLCH 配色(黛蓝/朱砂/桃夭/天青/竹青/赭石/青金/琥珀/落霞/青莲/草色/橙黄),明暗自适应;磨砂玻璃面板默认常开;微动效 + 版本/更新指示。零依赖、TypeScript、WCAG AA。

如何安装 dsh-bloom-theme?

在项目目录运行 npm install dsh-bloom-theme,或使用 pnpm add / yarn add / bun add。

dsh-bloom-theme 支持 TypeScript 吗?

支持。包内自带 TypeScript 类型声明(package.json 声明了 types 入口),安装后即可获得类型提示,无需再安装 @types 包。

dsh-bloom-theme 支持 ESM 还是 CommonJS?

以 ES Module 形式发布,推荐使用 import 引入。在 CommonJS 项目中,Node.js 20.19+ / 22.12+ 可以直接 require() 不含顶层 await 的 ES Module,更早的版本需要改用动态 import()。

dsh-bloom-theme 可以商用吗?

dsh-bloom-theme 使用 MIT 许可。宽松许可:允许商业使用、修改和再分发,通常只需在分发时保留原版权与许可声明。以上为概括,不构成法律意见,请以许可原文为准。

dsh-bloom-theme 还在维护吗?

最新版本 0.22.0 发布于 2026/11/03(今天);至今共发布 27 个版本,其中过去 12 个月发布了 27 个;首次发布于 2026/09/17。发布频率只是参考信号:功能稳定的工具可能很少需要更新,建议结合源码仓库的 issue 和提交记录判断。