dsh-catppuccin-theme

Catppuccin for DeepSeek Harness

中文 | English

目录

• 简介
• 特性
• 预览
• 安装
• 使用
• 玻璃拟态（Glassmorphism）
• 兼容性、权限与失败边界
• 开发
• 🙋 常见问题
• 💝 致谢

简介

DeepSeek Harness 的
Catppuccin 主题插件——一个包同时适配
Web GUI（dsh web）、桌面版（官方 Electron 壳 apps/desktop 与社区 DSH Desktop，
共用 desktop profile）与 dsh-TUI 终端：Web / 桌面端做全界面换色与玻璃质感，
TUI 端自动同步四套官方主题色板。

它内置 Catppuccin 的四个主题——Latte、Frappé、Macchiato、Mocha——
把整个界面的配色都换成对应的 Catppuccin 色板；并在 设置 → 常规 → 外观
下方提供一行 Catppuccin 快捷切换，选择会自动保存、重启自动恢复。

同时内置一套可开关的玻璃质感（Glassmorphism）皮肤：顶栏、侧边栏、
输入框、统计行、轨迹视图、聊天气泡、新会话按钮都变成磨砂玻璃卡片，
模糊度、磨砂度、背景亮度均可自由调节，玻璃颜色自动跟随当前
Catppuccin 主题。

特性

• 🎨 四个主题：Latte（浅色）、Frappé / Macchiato / Mocha（深色）
• 🧩 接入官方主题系统，与内置浅色 / 深色 / 跟随系统主题平级
• 🎯 全界面配色覆盖，不只是一两个强调色
• ⚙️ 设置页一行切换，选择自动保存、重启自动恢复
• 🔧 自定义 token 覆盖：按「--dsw-* 变量: 值」逐条覆盖单个配色 token（例如把注释色换成蓝色），与所选风味一起持久保存
• 🖍️ 代码块高亮风格：默认 / 注释斜体（italic-comments）两套 shiki 风格可选
• 🌐 中 / 英 / 日 / 韩 / 西 / 法 / 德七语文案（跟随系统语言）
• 🪟 玻璃质感（云母模式）：顶栏 / 侧边栏 / 输入框 / 统计行 / 轨迹视图 / 聊天气泡 /
  新会话按钮磨砂玻璃效果，设置里一键开关；云母 / 兼容双模式（兼容模式保持原版排版，
  只给输入框卡片与浮层上玻璃），模糊度、磨砂度、
  背景亮度自由调节（交互参考 DSH-Transparent-UI-Plugin）
• 🌫️ 玻璃拟态细节：页面上下边缘渐变模糊、折叠侧边栏悬浮玻璃、
  纯色背景跟随主题底色——内容滚入视口边缘时柔化穿过，层次更立体
• 🎨 玻璃配色自动跟随当前 Catppuccin 主题
• 🔄 检查 Catppuccin 插件更新：设置页一键检测本插件（dsh-catppuccin）在 npm 上的最新版本，发现新版直接给出可复制的升级命令；默认开启自动检查（启动后一次 + 每 6 小时），更新渠道可选稳定版 / Beta
• 💻 dsh-TUI 终端主题：一条安装命令装进 dsh-TUI，四套主题自动同步到 ~/.dsh-tui/themes/，见安装 · dsh-TUI

预览

四个主题在 DeepSeek Harness 中的实际效果（截图来自本地 GUI，文首大图为四主题斜切合成）：

🌻 Latte（浅色）

🪴 Frappé（深色）

🌺 Macchiato（深色）

🌿 Mocha（深色）

玻璃质感（Mica 云母模式）

同一会话在浅色（Latte）与深色（Mocha）下的磨砂玻璃效果：顶栏、侧边栏、
聊天气泡、输入框与统计行都是玻璃卡片，消息滚过页面边缘时被柔化，
背景为主题底色的纯色（截图来自本地 GUI）：

🌻 Latte（浅色玻璃）

🌿 Mocha（深色玻璃）

安装

方式一：从 npm 安装（推荐）

dsh plugin --profile web add @nonamelego/dsh-catppuccin

装完重启 dsh web 即可，dsh plugin 会自动把它加进 profile 的 bundles。
其他 profile 把命令里的 web 换成对应名字即可（如 headless）。

桌面版：桌面端默认激活的 profile 就叫 desktop（$DSH_HOME/profiles/desktop），
把命令里的 web 换成 desktop 即可：

dsh plugin --profile desktop add @nonamelego/dsh-catppuccin

在桌面的 DSH 终端里运行即可（dsh plugin 默认作用于当前激活的 profile，
若在托盘里选了别的 profile 就换成那个名字），装完重启桌面应用生效。
从仓库安装的方式同理：dsh plugin --profile desktop add https://github.com/NoNameLeGo/dsh-catppuccin-theme。

两个桌面壳，同一个 profile：官方 DeepSeek Harness
仓库里的 apps/desktop / apps/desktop-host（Electron，仍在开发中）与社区的
DSH Desktop 都启动
$DSH_HOME/profiles/desktop，所以上面的命令对两者都成立。本插件的桌面支持以
官方 web + 官方 desktop 为维护核心；社区壳的 desktopProfiles 服务探测也保留。
但官方壳的 profile 进程没有专用的环境标记（它的 DSH_DESKTOP_NODE_EXECUTABLE 只注入给
包安装子进程），所以本插件改为识别 Electron-as-node 运行时（process.versions.electron）
来判定官方桌面版——升级提示里的 profile 名与文案因此是对的；设置的读写不受影响。

方式二：从仓库安装

dsh plugin --profile web add https://github.com/NoNameLeGo/dsh-catppuccin-theme

从 git 安装时 pnpm 可能要求允许构建脚本——按 pnpm 的提示把对应包加进 profile
pnpm-workspace.yaml 的 allowBuilds 后重跑一次即可。

dsh-TUI（终端版）主题

与 Web GUI 插件同一个包。用标准的插件安装命令装进 dsh-tui profile：

dsh plugin --profile dsh-tui add @nonamelego/dsh-catppuccin

从仓库安装同理（也可用 git 形式，效果一致）：

dsh plugin --profile dsh-tui add https://github.com/NoNameLeGo/dsh-catppuccin-theme

包里带一个只做主题同步的小插件行（dsh-catppuccin-tui-themes，不依赖任何服务）：dsh-TUI 启动时自动把四套主题 JSON 同步到 ~/.dsh-tui/themes/，之后升级包即同步新版配色。装完启动 dsh --profile dsh-tui，在 dsh-TUI 里用 /theme 选择 Catppuccin Latte / Frappé / Macchiato / Mocha，或直接 /theme catppuccin-mocha 切换（选择会持久化，下次启动自动恢复）。

💡 已为 Web GUI 装过本插件、同时用 dsh-TUI 的话，无需重复安装：Web 端每次
启动会自动同步主题到 ~/.dsh-tui/themes/（仅当该目录已存在）。

📁 不想装包也可手动复制：把 themes/*.json 拷进 ~/.dsh-tui/themes/
（Windows：%USERPROFILE%\.dsh-tui\themes\），只是不随版本自动更新。

⚠️ catppuccin-*.json 归本插件所有、同步时会被覆盖；想自定义请改名另存。

💡 TUI 主题只管 TUI 内部配色，终端背景由你的终端决定——建议也配上对应
风味的 Catppuccin（见 Catppuccin ports 列表），观感最一致。

使用

1. 打开 Web GUI（默认 http://127.0.0.1:3080）；在 DSH Desktop 中则直接打开桌面应用即可。
2. 进入 设置 → 常规。
3. 在 外观 区域下方找到 Catppuccin 行，选择主题：
   Latte（浅色）、Frappé、Macchiato 或 Mocha（深色）。
4. 选择 跟随系统 则回退到官方主题——会还原你启用 Catppuccin 之前
   的官方偏好（浅色 / 深色 / 跟随系统），而不是强制重置。

Catppuccin 行里的其它选项

• 代码高亮风格：默认 / 注释斜体（italic-comments）——只影响代码块与 diff 的 shiki 高亮配色。
• 自定义覆盖（折叠区，按钮上显示已有条数）：按「--dsw-* 变量: 值」逐条覆盖单个 token，
  例如 --dsw-static-blue-500 → #89b4fa。键名失焦生效（必须以 -- 开头，否则该条会被丢弃）；
  值同样失焦生效、清空值即删除该条；✕ 删除整行。覆盖持久保存，与所选风味一起生效。

玻璃质感

在 设置 → 常规 的 Catppuccin 主题 正下方找到 玻璃质感 行：

• 总开关：开启后顶栏、侧边栏、输入框、统计行、轨迹视图变为磨砂玻璃；
  关闭即完全还原原生界面（无需刷新）。
• 模式：云母效果把界面改成悬浮磨砂卡片；兼容模式保持原版排版，
  只把材质换成玻璃。
• 性能：云母效果会在大面积区域（顶栏、输入框、侧边栏）做背景模糊，
  流式输出时占用 GPU 较明显（同一会话实测峰值约 80%，兼容模式不到 30%）；
  模糊半径本身不是主因（调到 0 px 也照样计费——只要不是 none，每帧都要回读背景）。
  在意占用就用兼容模式：它只在输入框卡片与浮层上做玻璃，命中面明显更小。
• 预设：清透 / 标准 / 磨砂 三档一键套用；想微调再用下面的滑条
  （当前旋钮值与某档一致时该档高亮）。
• 玻璃模糊度（0–40 px）、磨砂度（0–100%）：控制玻璃的模糊半径与
  不透明度。
• 背景亮度：深色模式 0–50 压暗、浅色模式 50–100 提亮（50 为原样），
  直接调和进纯色背景。

玻璃配色自动跟随当前主题，切换 Latte / Frappé / Macchiato / Mocha 时即时
变色；所有设置跨重启自动恢复。

检查 Catppuccin 插件更新

在 设置 → 常规 的 玻璃质感 正下方找到 检查 Catppuccin 插件更新 行：

• 点击 检查更新 即对比 npm 上的最新版与当前版本：已是最新 → 显示当前
  版本号；发现新版 → 显示新版本号并给出可复制的升级命令（命令中的 profile
  名自动探测，无需手动替换；探测失败才回退为 web）。
• 自动检查：默认开启——启动后检查一次、之后每 6 小时一次（该行可关闭）；
  渠道可选 稳定版（只跟 latest）或 Beta 版（连预发布一起跟）。
• 本插件为本地链接 / 源码安装（link: / file: / git）时不显示 npm 升级
  命令，会提示改用 git pull 或重新构建。
• 通道策略：正式版只跟随 latest 标签；预发布版同时跟随 beta（升级命令
  自动带 @beta）。离线或网络失败时显示原因并可重试。

玻璃拟态（Glassmorphism）

玻璃拟态是一种视觉风格：界面面板像一片磨砂玻璃——半透明填充、
背景模糊（backdrop-filter: blur()）和玻璃细节（描边、内高光、柔和投影），
透过它能看到并柔化背后的内容。

本插件的具体效果：

• 七个区域玻璃化：顶栏、侧边栏、输入框、统计行、轨迹视图、聊天气泡
  和新会话按钮；云母模式下成为带圆角的悬浮卡片，聊天内容滚动时从玻璃
  下方穿过、被模糊；折叠侧边栏时导航条同样悬浮在聊天区边缘；
• 页面边缘渐变模糊：视口上下各有一条渐变模糊带，消息滚到边缘时被
  柔化穿过——内容在边界「融化」（借鉴
  DSH-Transparent-UI-Plugin
  的 Aqua 皮肤）；
• 配色自动跟随主题：Latte 是浅色玻璃、Mocha 是深色玻璃，切换主题即时
  变色；页面底色取当前主题纯色，背景亮度旋钮直接往纯色里调和白/黑；
• 一键开关：关闭即完全还原原生界面，插件卸载不留任何残留。

兼容模式会命中哪些面

兼容模式靠类名子串与语义属性给宿主与第三方插件的悬浮面加玻璃，不需要任何插件配合——
代价是子串匹配无法区分「面」与「面里的行级容器」。自 0.5.8 起，明确会被命中的族只剩这些：

族	锚点
输入框卡片	[data-composer-card]（宿主自己的属性）
菜单	[role='menu']
弹出层	[class*='popover'] / [class*='dropdown']（这两个仍是子串）
模态框	[role='dialog'][aria-modal='true']
宿主右侧栏（仅展开态）	[data-sidebar-right-panel][data-sidebar-right-open]

0.5.8 按证据把最宽的三族收窄掉了（宽泛的 card 子串、panel 子串、行级 tooltip，详见
issue #17），但第三方插件里新出现的类名仍可能被误命中。默认收窄要讲证据，遇到时走下面三步。

1. 取证（只读，粘进浏览器控制台）

列出当前所有被玻璃规则命中的元素、命中的规则原文与 computed 值：

(() => {
  const rules = []
  for (const ss of document.styleSheets) {
    let rs; try { rs = ss.cssRules } catch { continue }
    for (const r of rs) if (r.selectorText && r.selectorText.includes('dsh-glass')) rules.push(r)
  }
  const out = []
  for (const el of document.querySelectorAll('[class*="card"],[class*="panel"],[role="tooltip"]')) {
    const hit = rules.filter(r => { try { return el.matches(r.selectorText) } catch { return false } })
    if (!hit.length) continue
    const cs = getComputedStyle(el), b = el.getBoundingClientRect()
    if (b.width < 8 || b.height < 8) continue
    out.push({ cls: String(el.className).slice(0, 48), w: Math.round(b.width), h: Math.round(b.height),
               bf: cs.backdropFilter, bg: cs.backgroundColor,
               rule: hit.map(x => x.style.cssText).join(' | ').slice(0, 60) })
  }
  console.table(out.slice(0, 40))
})()

2. 临时止血

插件没有「自定义 CSS」配置项（DSH 的 profile patch 层只能给插件写 config，没有通用样式入口），
所以这一步要用外部注入——浏览器扩展（Stylus / 暴力猴）或 DevTools 的 Overrides——加一条
!important 规则把该族还原，例如：

[class*='yourRow'] { backdrop-filter: none !important; background: none !important; outline: none !important; }

3. 反馈

把第 1 步的表格输出连同 DSH 与插件版本贴到
issues。0.5.8 就是这么修出来的：
报告人给了逐元素的 computed 对照，我们据此收窄默认规则——这也是为什么没有「自定义 CSS」
配置项：默认行为应该先是对的，配置项只能当补充。

兼容性、权限与失败边界

兼容范围

项	声明
DSH	>=0.1.5-rc.1（同时适配两套 settings seam：≤ 0.1.6-alpha.2 的旧通道与 ≥ 0.1.7-alpha.1 的 configForms）
Node.js	>=20
Profile	web（Web GUI 与两个桌面壳都启动 web 界面，共用本插件）；桌面端默认 profile 名为 desktop
已验证的具体版本	0.1.7-rc.1：真实 profile 上完成安装、启动、改设置落盘与重启恢复（证据）；0.1.7-rc.2：启动级 e2e 与玻璃层的真页采样（issue #16 / #17）；0.1.5-rc.3、0.1.7-alpha.1、0.1.7-alpha.2 为同一 seam 的声明

以上也是 package.json 里 dsh.compatibility（dsh / dshReleases / dshOperations）的机器可读版本。

权限与外部访问

类别	用途	边界
文件读	识别当前 profile 与安装来源（$DSH_HOME/profiles/ 下的目录名）；一次性读取旧状态文件 ~/.dsh/catppuccin-state.json 做迁移	只读；DSH_HOME 取自 process.env.DSH_HOME，缺省 ~/.dsh
文件写	把四套 TUI 主题 JSON 同步到 ~/.dsh-tui/themes/（dsh-TUI 只从该目录读主题，无注册 API）	只写这一个目录；~/.dsh-tui 不存在时是严格 no-op。设置本身由 DSH 的 settings 服务写入，插件只经官方服务读写
网络	「检查更新」读取 npm registry 上 @nonamelego/dsh-catppuccin 的元数据；页面侧再向本插件的宿主路由取一次结果	只访问 registry.npmjs.org 与同源插件路由；无遥测、无上报；离线时该行报错、不影响使用
命令	无	不执行任何子进程 / shell
凭据	无	不读取任何 token、key、密码；仅读 DSH_HOME 与桌面壳标记类环境变量

失败边界

• 更新检查失败（离线、registry 异常、限流）只影响设置页那一行，不阻塞启动，也不影响主题与玻璃；
• 主题注册失败时 DSH 自身主题照常可用；
• 安装期只执行 prepare（本地用它构建 lib/）。仓库里的 scripts/（截图、E2E、changelog 生成）不随 npm 包发布（files 不含 scripts），也不会在安装时执行。

开发

pnpm install
pnpm typecheck       # tsc --noEmit：src 的类型检查
pnpm typecheck:tests # tsc --noEmit：tests 的类型检查（vitest 跑 esbuild，不做类型检查）
pnpm test            # vitest 跑配色表 / 契约 / e2e 覆盖测试
pnpm build           # tsdown 构建 -> lib/index.js（服务端）+ lib/client.js（浏览器）

配色表由生成器脚本产出——修改 scripts/generate-palettes.mjs 后重跑
（--pin <sha> 可把上游 commit SHA 写进 palettes.ts 头部，见
docs/plugin-improvements.md 的 L 项）：

node scripts/generate-palettes.mjs [--pin <upstream-sha>]

CHANGELOG 草稿由 conventional 提交生成（提交正文里的 EN: 行会被渲染成英文摘要）：

pnpm changelog:gen            # 打印上一 tag 之后的草稿
pnpm changelog:gen -- --write # 直接写入 [Unreleased] 节

对外 API（./client、./tui-themes 子路径导出）的 typedoc 文档按需本地生成到
docs/api/（该目录不入库、已进 .gitignore；哪天真需要在线版本再接 CI 发布）：

pnpm docs:api

贡献指南见 CONTRIBUTING.md；状态契约的版本迁移约定见
docs/state-migrations.md。

本地链接调试

克隆到本地后，把包链接进 profile（把路径换成你自己的；$DSH_HOME 默认是 ~/.dsh）：

pnpm --dir ~/.dsh/profiles/web add link:/path/to/dsh-catppuccin
# Windows 例：
# pnpm --dir C:\Users\<you>\.dsh\profiles\web add link:D:\dev\dsh-catppuccin

再把 @nonamelego/dsh-catppuccin 加进 profile package.json 的
dsh.profile.bundles，重启 dsh web。DSH Desktop 用
~/.dsh/profiles/desktop 对应路径。

🙋 常见问题

• Q: "为什么外观行里看不到 Catppuccin 主题？"
  A: 官方外观行只列出内置的浅色/深色/跟随系统偏好。四个主题在它正下方的
  Catppuccin 行里。
• Q: "我的主题选择是怎么记住的？"
  A: 选择持久保存在 DSH 的官方设置里（同一台机器的 DSH 共享这份偏好），浏览器
  localStorage 作为即时缓存与多标签页同步。落点随 DSH 版本而异：0.1.6 及更早
  存于 DSH home 下的官方 settings 文档（catppuccin 命名空间）；0.1.7 起上游
  改为「插件配置表单」，落点是当前 profile 的 patch 文件里本插件的 config: 段
  （本插件两套都支持，按宿主实际提供的服务自动选择）。因此换浏览器、清站点数据、
  自定义端口（dsh web --port）或再开一个桌面实例，偏好都不会丢；
  DSH Desktop（官方壳与 anywhere-labs/dsh-desktop）同样跨重启自动恢复。
  玻璃质感开关与各旋钮同样持久保存。0.5.0 起旧版 catppuccin-state.json
  会在首次启动时一次性迁移进官方设置（文件保留作回退）。
• Q: "怎么知道这个插件有没有新版本？"
  A: 设置 → 常规 → 检查 Catppuccin 插件更新 一键检测本插件在 npm 上的最新版本，
  发现新版会给出可复制的升级命令；也可以随时手动执行
  dsh plugin --profile web update @nonamelego/dsh-catppuccin
  （或重新 add 最新版）。在 DSH Desktop 中，把 web 换成 desktop
  （dsh plugin --profile desktop update @nonamelego/dsh-catppuccin），
  或者直接在 DSH 终端里运行 dsh plugin update（默认作用于当前 profile）。

💝 致谢

• Catppuccin 提供的色板与 port 模板
• DeepSeek Harness 的插件体系
• DSH-Transparent-UI-Plugin
  的玻璃质感交互与实现参考（云母 / 兼容双模式、模糊度 / 磨砂度等旋钮设计）

 

Copyright © 2021-present Catppuccin Org