夜雨聆风想象一下，在你的电脑上，把网页变成视频。 接上你本地的 Coding Agent（Open Design · Claude Code · Cursor · Codex · Hermes · 或 DeepSeek API）。
描述一个视频，或者直接粘一个文章链接 / GitHub 仓库，Agent 就把它变成一支多帧、带动画的视频 —— 然后就在你这台机器上渲染成真实 MP4。一个 Agent 循环、可插拔渲染引擎、精选模板库、可选 AI 配乐。无单次渲染费用，不绑定厂商。渲染出来的视频可以发视频号赚钱，爽不爽？
这就是今天要介绍的这个项目：html-video
速览
| Coding agent（6 个） | Open Design (Vela) · Claude Code · Cursor Agent · Codex CLI · Hermes · Anthropic Messages API —— 在 PATH 上自动探测，顶栏一键切换。 |
| 真实 MP4 渲染 | 无头 Chromium 录制带动画的 HTML，ffmpeg 编码（libx264）—— 全在本地，无云端渲染，无单片费用。 |
| 文章 / 仓库 → 视频 | 粘一个 URL 或 GitHub 仓库；studio 在服务端抓取（支持微信公众号文章），用真实内容生成视频。 |
| 21 个模板 | 精选、许可清晰的样式：数据可视化、产品宣传、社媒短片、解说、动感排版、转场 —— 在模板库里实时预览。 |
| 多帧故事板 | content-graph 驱动多场景视频；逐帧改文案、重排、重渲染。 |
| AI 配乐 | 可选背景音乐 + 旁白（MiniMax），导出时混进 MP4。 |
| Studio + CLI | 一个本地浏览器 studio，外加一个可脚本化的 html-video CLI。 |
工作流程
prompt / 链接 / 仓库 │ ▼ ① 来源抓取 studio 在服务端拉取 URL 或仓库，扁平成 Markdown │ ▼ ② agent 循环 agent 读素材 + 所选模板的风格，产出一份 │ content-graph（故事板）+ 每帧一个 HTML 块 ▼ ③ content-graph 多帧中间表示 —— 节点（实体 / 数据 / 文本）+ 边（顺序 / │ 依赖 / 对比）；拓扑排序成帧序与时长 ▼ ④ 逐帧 HTML 每个节点变成一个自包含、带动画的 HTML 帧，落到磁盘 │ ▼ ⑤ Hyperframes 渲染 无头 Chromium 加载每一帧并录制（会自动延长时长 │ 以覆盖该帧自身的动画）→ 每帧一个 webm ▼ ⑥ ffmpeg 每个 webm → mp4（libx264），再 concat 成一支视频； │ 可选混入 MiniMax 的音乐 + 旁白 ▼ 你的.mp4快速开始
pnpm installpnpm -r buildnode packages/cli/dist/bin.js studio # 在 http://127.0.0.1:3071 打开 studio在 studio 里：挑一个模板（或直接描述视频 / 粘链接），跟 agent 对话，逐帧改文案，加配乐，导出 MP4。
CLI 工具：
node packages/cli/dist/bin.js doctor # 探测已安装的 agent + 引擎node packages/cli/dist/bin.js search-templates --intent "github stars race" --top 3开源地址
开源地址：https://github.com/nexu-io/html-video各位朋友，尽情去创作吧