在 DeepSeek Harness (DSH) 的 WebUI 使用场景中，除了模型交互，开发者往往需要定制界面风格。传统的主题修改可能需要覆盖大量代码。这里介绍一个纯展示层插件，它通过 Canvas 动画和细粒度的 CSS 部件拆分，在不改变底层服务逻辑的前提下，为 DSH WebUI 提供了“锦鲤池塘”的视觉体验。
插件介绍¶
这是一个名为 dsh-skin-koi-pond 的 DSH WebUI 主题插件，由 Kogisune 维护，采用 MIT 许可证。它通过 Canvas 动画和 7 部件 CSS 拆分结构，为 WebUI 提供了“锦鲤池塘”的视觉意象，支持亮暗双主题。
核心功能¶
该插件主要提供以下能力：
- 锦鲤池塘动画：基于 Canvas 2D 实现锦鲤的聚群、对齐、分离行为，支持鼠标驱赶。当页面隐藏时动画自动暂停。
- 亮暗双主题：提供“池塘夜色”（深色）和“宣纸日色”（浅色）两套主题。
- 视觉遮罩：背景采用 15% 白色遮罩加 3px 模糊，柔化动画并突出前景 UI。
- 部件拆分 CSS：采用 7 部件拆分（background / sidebar / titlebar / composer / overlay / fonts / ui）结构，覆盖 DSH 官方设计令牌。
- 辅助色：提供金鳞、荷叶、水光蓝等配色辅助。
- 纯展示层：不注入服务、不发 Cordis 事件、不触达模型请求，仅覆盖设计令牌。
安装与启用¶
作为 DSH 插件安装，执行以下命令：
dsh plugin --profile web add github:Kogisune/dsh-skin-koi-pond
安装后需重启 DSH Web 服务以使配置生效。
使用方法¶
实时切换配色¶
在 DSH WebUI 的浏览器控制台中调用 __koiSetScheme 接口可实时切换锦鲤配色，该操作不会重建鱼群：
__koiSetScheme('ogon')
构建主题¶
若需修改 CSS 或源码，需运行构建命令：
node scripts/build.mjs
注意事项¶
- 依赖：依赖
@deepseek-ai/cordis(^4.0.1)。 - 无障碍：支持
prefers-reduced-motion，会自动降级为静态渲染。 - 生效时机：修改 CSS 或源码后必须重新运行
node scripts/build.mjs，DSH 加载的是lib/构建产物。 - 权限范围：作为纯展示层，它不会干扰模型请求和 Cordis 事件。
