DeepSeek Harness 背景图片插件

DSH (DeepSeek Harness) 的界面默认风格较为简洁。如果你希望在开发或演示时，将界面背景替换为自定义图片或渐变，以获得更沉浸的视觉体验，可以使用 dsh-plugin-background-image。该插件由 Voyage-He 维护，基于 MIT 许可证开源。

插件概览¶

该插件允许你将 Web 图片、本地图片或预设渐变设置为 DSH 的界面背景。除了基础的图片切换，它还提供了图片不透明度、显示范围、毛玻璃模糊、分区域透明度以及聊天内容偏移等细粒度控制。

安装¶

使用官方提供的安装命令进行添加。将 <profile> 替换为你使用的 DSH 配置文件名称。

npx @deepseek-ai/dsh plugin --profile <profile> add dsh-plugin-background-image

安装完成后，使用相同的 profile 启动 DSH，插件将自动加载。

核心功能¶

1. 资源支持¶

插件支持三种类型的图片资源：
* Web 图片：支持 http:// 或 https:// 链接。
* 本地图片：使用绝对路径（例如 /Users/name/Picture.png）。
* Data URL：直接嵌入的 Base64 数据。

2. 本地图片失效检测¶

插件会在页面加载以及打开设置页面时自动探测本地图片路径。如果文件被移动或删除，界面会提示你需要重新选择图片。本地文件路径仅被记录，不会被复制或移动。

3. 渐变预设¶

提供了一套预设的渐变色板，包括 Aurora、Sky、Sakura、Sunset、Mint 和 Ocean，方便快速切换风格。

4. 显示范围与沉浸式模式¶

你可以选择背景的显示范围：
* 沉浸式全屏：背景覆盖整个页面。
* 仅对话区域：背景仅显示在对话列表和撰写框所在的区域。

5. 毛玻璃效果与饱和度¶

侧边栏与卡片：侧边栏和撰写器卡片支持毛玻璃模糊和颜色饱和度调节。
对话区域独立控制：对话区域拥有独立的模糊强度（0–48 px）和不透明度（0–100%）设置。默认情况下为透明且无模糊，以保留原有设置。

6. 分区不透明度¶

侧边栏、对话区域和撰写器的不透明度可以分别调节。注意，侧边栏的不透明度设置仅在沉浸式全屏模式下生效。

7. 聊天内容偏移¶

通过左右偏移聊天内容（消息列表 + 撰写框，支持 ±320px），可以在不改变列宽的情况下，更好地展示背景图片的细节。

配置与持久化¶

所有设置都会自动保存到 settings.yaml 文件中，并在刷新页面或重启 DSH 后自动恢复。

配置示例¶

插件会在配置文件中生成 background-image 节点。以下是配置结构的示例：

background-image:
  enabled: true
  mode: fullscreen
  opacity: 0.9
  image: https://example.com/background.webp
  blur: 12             # 毛玻璃模糊强度（侧边栏和卡片），0 为关闭
  conversationBlur: 0 # 对话区域独立模糊（0-48 px）
  conversationOpacity: 0 # 对话区域独立不透明度（0-1）
  saturation: 1.4      # 毛玻璃颜色饱和度
  sidebarOpacity: 0.5  # 侧边栏不透明度（全屏模式）
  composerOpacity: 0.72 # 撰写器不透明度
  contentOffset: 120   # 内容水平偏移（px），正数为右，负数为左

本地图片加载机制¶

由于浏览器安全策略，无法直接加载 file:// 资源。插件会在宿主注册一个只读的文件服务路由（GET /plugins/background-image/file?path=<绝对路径>），通过同源 HTTP 协议向页面返回本地图片。该路由仅接受回环地址，且只服务于当前配置中引用的路径。

已知限制与注意事项¶

全局背景 Token 覆盖：插件会覆盖 DSH 的全局背景 token --dsw-alias-bg-base。虽然插件会强制将已知面板/按钮设为表面色，但未来 DSH 更新中新增引用该 token 的元素可能需要后续调整。
内部类名依赖：毛玻璃效果和内容偏移依赖于 DSH 的内部哈希类名（如 .pI_x6G_frame）。如果 DSH 版本更新导致类名变更，相关效果可能会失效或错位。
侧边栏毛玻璃实现：侧边栏的毛玻璃效果通过伪元素（.pI_x6G_sidebarCol::before）实现，而非直接应用在侧边栏容器上。这种实现方式避免了 backdrop-filter 在包含 position: fixed 子元素时可能出现的渲染问题。

总结¶

dsh-plugin-background-image 为 DSH 提供了从基础图片切换到精细化 UI 定制的完整能力。对于需要定制界面风格、进行演示或增强沉浸感的用户，这是一个实用的工具。

GitHub 仓库: https://github.com/Voyage-He/dsh-background-image
插件目录: https://www.skillhub.cn/plugins/Voyage-He/dsh-background-image