dsh-ui-appearance

DeepSeek Harness 外观自定义插件 —— 自由调色的主题色板、壁纸背景、毛玻璃与背景氛围,全部实时预览、自动持久化。

零核心代码改动:完全通过官方插件机制(ctx.theme.overrideTokens() 主题扩展点与 settings.general.item 插槽)实现;卸载后界面完整恢复默认。

功能

主题颜色 —— 8 个颜色角色:主色、背景色、面板色、输入框色、文字色、边框色、用户/AI 消息气泡。每个角色都支持取色器与 HEX 输入;文字选区与键盘焦点环自动跟随主色。

壁纸背景 —— 点击上传或拖拽图片(JPG / PNG / WebP),自动压缩后作为全界面壁纸;上传时自动采样亮度,深色壁纸会协调抬亮表面、翻亮文字、按钮跟随变暗,保证可读性。

毛玻璃与半透明 —— 面板不透明度与毛玻璃强度两个滑块,让侧边栏、聊天区、卡片、按钮一同融进壁纸,而非突兀的实心色块。

背景氛围 —— 背景不透明度、背景模糊、背景遮罩三个独立滑块:不透明度控制壁纸的浓淡,模糊让壁纸退到远处,遮罩在壁纸上叠加随深浅色模式自动配色的纱帘,保证图片上的文字易读。

预设起步 —— 默认 / 午夜 / 海洋 / 森林 / 玫瑰 / 单色六套预设,一键应用后仍可自由微调,不被预设锁死。

所有修改实时生效,无需刷新,无需保存。

安装

一条命令:

git clone https://github.com/TQSY114514/dsh-ui-appearance.git
dsh plugin --profile  add file:

卸载:dsh plugin --profile remove @deepseek-ai/dsh-client-ui-appearance

安装流程已验证端到端:file: 安装会把插件复制进 profile 目录树,host 半部零 @deepseek-ai 运行时依赖,浏览器与 Host 均能正确加载。克隆后 pnpm install 会自动构建;修改代码后重新执行 pnpm install && pnpm prepare 并重启 dsh web。

使用

1. 打开 WebUI,进入侧栏「设置」→「通用」
2. 在「外观」行下方找到「个性化外观」,点击展开
3. 点预设快速换肤 → 用取色器或 HEX 微调每个颜色角色 → 上传或拖入壁纸 → 拖动氛围滑块
4. 完成。所有调整实时生效

持久化与恢复

• 设置保存在浏览器 localStorage(键 dsh-ui-appearance.settings),刷新与重启后保留,多标签页自动同步
• 从 profile 移除插件后界面恢复默认:卸载时自动回收所有覆写 token、样式表与背景图层
• 注意:设置跟随浏览器,换浏览器或清除站点数据会丢失;壁纸以压缩后的 data URL 存储,受 localStorage 配额约束

工作原理

能力	机制
颜色	ctx.theme.overrideTokens() 覆写 --dsw-alias-* 语义 token,浅/深模式切换自动重套,派生色按模式推导
背景图层	自有的固定定位图层,位于页面背景之上、内容之下,由 CSS 变量驱动
半透明	表面 token 按模式烘焙为 rgba()(角色色 → 深色翻转色 → 默认面色表),不依赖 color-mix,全浏览器可用
持久化