这是什么神仙工具,一个本地网页加上 AI 就能制作视频

想象一下，在你的电脑上，把网页变成视频。 接上你本地的 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

各位朋友，尽情去创作吧