除了生成 markdown 之外，让 Agent 通过单页 HTML 交付可视化素材也应用的越来越多。例如一个落地页、报告页、活动页，一个文件就能直接打开。
加上上周 DeepSeek Harness 发布，我就给 DSH 做了一个插件：HTML Workbench。一句话生成 HTML 之后，可以在侧边栏随时预览；不仅能随时预览，还可以随手「微调页面」。
项目托管在：github.com/alienzhou/h...
先看效果
让 Agent 给项目生成一个介绍页：
生成出来就是一个普通的 HTML 文件，可以在侧边栏直接预览。但不光是预览------它还是一个可视化编辑器。
你直接在页面上点选元素改文案、换图、调样式，改动实时保存回项目里的源文件：
而且人可以改，AI 也可以同时改。你对 Agent 说一句「把页面的按钮颜色改成紫色」，它改它的，你改你的，两边在同一个文件上协同：
换字体、调边界、改布局，这些过去要在聊天框里来回好几轮的事，现在鼠标点两下就完成了。想验证交互，切到 Preview 模式：
它不是 HTML 生成器
这是我想强调的第一件事：HTML Workbench 不生成 HTML。
你可以用任何 AI、任何设计工具、甚至手写代码去产出页面，然后把文件交给 Workbench。它做的事是把一个已有的 HTML 文档，变成一个带预览、能和 AI 实时协同的可视化编辑器。
架构：本地 HTML 源文件是唯一事实源
整个设计的核心就一条：所有编辑都围绕本地 HTML 源文件进行。
- 本地编辑台：Python 起一个本地服务，编辑页基于 GrapesJS 做可视化编辑，针对 AI 生成的 HTML 做了一些继承和特殊情况的处理；
- 人与 AI 双模式：人做点选编辑、样式微调；AI 直接编辑 HTML 源文件；
- 协作机制：双方的修改都落回同一个源文件，配合 revision 检查，编辑器状态过期时会停下来，而不是把 AI 刚做的改动覆盖掉。
这个设计的好处是：Workbench 不引入任何私有的中间格式。文件就是文件，任何时候你都可以关掉工作台，直接用编辑器打开，或者把文件丢给下一个工具。
服务只监听 127.0.0.1，文件不会暴露到局域网。
两种用法
用法一：作为 DeepSeek Harness 插件。
如果你在用 DeepSeek Harness，它有一等公民的插件支持，可视化编辑器直接嵌在 web UI 的右侧栏，Agent 一创建或修改 .html 文件，面板自动跟上，不用单独开浏览器窗口：
bash
dsh plugin --profile web add @vibe-x/dsh-html-workbench
用法二：作为 Skill 挂载到任意 Agent。
一条命令安装，挂到 Claude Code、Codex 这类 agent 客户端上就能用：
bash
npx skills add vibe-x/html-workbench之后你让 Agent 生成 HTML，它会自动引导你把页面在 Workbench 里打开。
