lxxz1918/dsh-theme-customizer 预览 preview

lxxz1918/dsh-theme-customizer

DeepSeek Harness(DSH)Web 界面自定义主题插件:背景/文字/框线/细节全可视化调整,可导入导出预设,持久化保存。

Project Overview项目介绍

dsh-theme-customizer is a visual theme plugin for the DeepSeek Harness web UI. It covers seven interface regions, letting users adjust backgrounds, text, borders, icons, and panel layout through drag-and-drop. Settings persist in localStorage and can be exported as shareable .tczp preset files that embed images. It suits users who want personalized DSH themes or quick preset switching across devices. Note: the persistent Cordis button requires applying apply-patch.cjs manually, and the patch must be reapplied after every DSH upgrade.

dsh-theme-customizer 是 DSH Web 界面的可视化主题定制插件,支持七大区域背景、文字、框线、图标与布局拖动等精细调整,配置自动存于 localStorage 并可导出为含图的 .tczp 预设文件分享。适合追求个性化 DSH 界面、需要跨设备同步主题或快速切换预设的用户使用。注意:Cordis 按钮常驻功能需手动运行 apply-patch.cjs 补丁,且 DSH 升级后需重新执行。

Or use CLI install (for developers)或使用命令行安装(适合开发者)

CLI Install命令行安装

dsh plugin --profile web add dsh-theme-customizer

lxxz1918/dsh-theme-customizer 加入你的 DSH 配置(web profile)即可启用。

READMEREADME

dsh-theme-customizer

Awesome DSH Plugin npm version license topic: dsh-plugin stars

中文 | English

DeepSeek Harness(DSH)Web 界面自定义主题插件:背景、文字、框线、细节全部可视化设置,刷新/重启不丢。 配置存 localStorage,预设可导出 .tczp 文件(含图片)分享到任意电脑。

🎨 主题展示

四套 AI 生成的壁纸作为主题的示例,每套含两种主界面「显示区域」模式:包含侧边栏不包含侧边栏,配套 .tczp 预设一键导入。(详见下方“资源包”)

🌌 星空极光(暗) 🌇 黄昏云海(亮)
星空极光 黄昏云海
🌃 赛博夜景(暗) 🌸 樱花晴天(亮)
赛博夜景 樱花晴天

📸 界面截图

每套主题两种模式(对应预设 -0 / -1):显示区域包含侧边栏显示区域不包含侧边栏。每种模式 3 张:正面-1 / 正面-2 / 设置面。

🌌 星空极光(暗)

显示区域包含侧边栏(-0)

正面-1 正面-2 设置面
星空极光A-1 星空极光A-2 星空极光A-设置

显示区域不包含侧边栏(-1)

正面-1 正面-2 设置面
星空极光B-1 星空极光B-2 星空极光B-设置
🌇 黄昏云海(亮)

显示区域包含侧边栏(-0)

正面-1 正面-2 设置面
黄昏云海A-1 黄昏云海A-2 黄昏云海A-设置

显示区域不包含侧边栏(-1)

正面-1 正面-2 设置面
黄昏云海B-1 黄昏云海B-2 黄昏云海B-设置
🌃 赛博夜景(暗)

显示区域包含侧边栏(-0)

正面-1 正面-2 设置面
赛博夜景A-1 赛博夜景A-2 赛博夜景A-设置

显示区域不包含侧边栏(-1)

正面-1 正面-2 设置面
赛博夜景B-1 赛博夜景B-2 赛博夜景B-设置
🌸 樱花晴天(亮)

显示区域包含侧边栏(-0)

正面-1 正面-2 设置面
樱花晴天A-1 樱花晴天A-2 樱花晴天A-设置

显示区域不包含侧边栏(-1)

正面-1 正面-2 设置面
樱花晴天B-1 樱花晴天B-2 樱花晴天B-设置

功能一览

  • 界面板块(7 区域背景):主界面 / 侧边栏 / 对话区 / 输入区 / 设置界面 / 浮窗面板 / Cordis 插件界面
    • 每区域:无 / 纯色 / 图片(选区裁剪)+ 透明度(数值越大越透明)+ 底色(独立层)
    • 主界面支持「包含侧边栏 / 不包含侧边栏」显示区域切换
    • 侧边栏图片用 mask 直接淡出,不盖顶部 UI、不挡设置面板
    • 侧边栏收起后独立配置:主界面 / 侧边栏各有一份「收起后」设置(折叠侧边栏时生效,切换淡入淡出)
  • 框线板块:所有界面默认边框/分隔线颜色 + 透明度,主界面(含侧边栏)/ Cordis / 输入区 / 设置界面 / 浮窗 5 区域独立
  • 字体颜色板块:正文 / 过程 / 辅助 / 弱化 / 强调 5 类文字颜色(亮暗主题共用,可恢复官方默认)
  • 标志调色:左上角 DeepSeek Harness 标志颜色 + 透明度;「Harness」文字部分可单独调色;侧边栏收起后的标志(鲸鱼图标)可独立配置(默认跟随展开态)
  • 新会话欢迎页调色:空态页鲸鱼图标 / 「探索未至之境」标题 / 「预览版」徽章文字 / 徽章背景,各可独立调色 + 透明度(默认官方原色,与正文文字颜色解耦)
  • 对话区细节:用户发言气泡 / 行内代码 / 代码块背景 / 代码块滚动条 / 对话区滚动条 / 任务栏收起展开 / 「一键到底」按钮背景
  • 输入区:背景、输入框固定高度(1~10 行)、统计条接管渲染(9 项独立开关 + 完全展开)、命令按钮/菜单背景
  • 新会话按钮:无/纯色/图片样式 + 显示文本/图标开关 + 图标/文本颜色独立设置 + 底色
  • 布局调整:设置界面面板可拖动(拖 header 移动 + 位置持久化 + 一键复位)
  • 浮动主题面板:可拖动的迷你设置面板(勾选显示内容),顶层不遮挡
  • 预设:保存/应用/重命名/删除/导出/导入(.tczp 含图,最多 10 个)+ 拖拽排序
  • 全局恢复默认:一键重置所有设置(三级确认防误触)

安装

# 方式一:npm 安装(发布包)
npm install -g dsh-theme-customizer
dsh plugin --profile web add dsh-theme-customizer

# 方式二:本地目录安装(GitHub clone 后)
dsh plugin --profile web add <本仓库路径>

装完重启 dsh web 生效。验证:设置 → 主题 出现即可。

使用

  1. 打开 设置 → 主题,按板块调整;改动即时生效、自动保存(页面底部显示「最近保存」时间)
  2. 需要快速调整时可点右上「↗ 打开浮窗」,浮窗可拖动
  3. 装完想验证对话区各选项效果,可用 对话区测试指令.md 里的测试文本

Cordis 按钮常驻(可选)

主题设置里「Cordis 按钮常驻」开关依赖 dsh-client-ui-cordis 补丁(本插件随包提供 apply-patch.cjs 一键打补丁),未打补丁时开关不生效。安装:

node apply-patch.cjs           # 打补丁(自动备份)
node apply-patch.cjs --check   # 查看状态
node apply-patch.cjs --undo    # 撤销

⚠️ DSH 升级会覆盖官方包,升级后需重跑 apply-patch.cjs。细节见 PATCH-CORDIS-BUTTON.md

从源码构建(开发者)

# 1. 拼接源码片段(optimized/src/ → optimized/dist/,自动语法校验 + 行号映射/符号表)
node optimized\build.cjs

# 2. 生成静态 client bundle(dist/p3_2_client.js → lib/client.js)
node build_static.cjs optimized\dist\p3_2_client.js lib\client.js

# 3. 语法校验 + 安装测试
node --check lib\client.js
dsh plugin --profile web add <本仓库路径>

源码结构:optimized/src/ 16 个片段(00_*~15_* + host.js)按文件名拼接为插件函数体,功能定位查 optimized/INDEX.md

预设文件(.tczp)

预设面板 → 「导入预设」选择 .tczp 文件即可恢复整套配置(含图片,无需原图)。导出同样在预设面板逐条「导出」。

📦 素材包

四套主题的完整素材(壁纸原图 + 8 个 .tczp 预设 + 全部展示截图)打包在 GitHub Releases 附件assets.7z 中,下载后 7-Zip 解压即可:

展示/
├── readme展示图/          # README 用展示截图(4 主题 × 2 方案 × 3 张)
├── 展示1/ ~ 展示4/        # 每套:壁纸原图(横版 + 竖版)+ 2 个 .tczp 预设 + 截图
└── (壁纸竖版/横版原图见 展示N/N-0、N-1)

预设导入:设置 → 主题 → 预设面板 → 导入预设 → 选 展示N-N.tczp,自动带图还原整套效果。

卸载

dsh plugin --profile web remove dsh-theme-customizer

联系与反馈

  • 使用问题 / 功能建议 → Issues 发议题
  • 维护时间:每周日集中查看议题并回复
  • 哔哩哔哩:个人主页

AI 使用说明

本项目由 lxxz1918 主导设计与验收,代码在 AI 助手(DeepSeek)辅助下编写。所有功能需求、界面文案与最终效果均由作者本人确认。

License

MIT

上一个 Prev foreman-dsh 下一个 Next dsh-cyberpunk-theme