html-video – Open Design 團隊開源的 HTML 版剪映

html-video是什麼

html-video 是 Open Design 團隊（nexu.io）開源的HTML版剪映，基於 hyperframes 框架構建。工具讓 Agent 通過寫 HTML 可生成世界級水準的產品宣傳、知識解說等視頻，內置 20+ 頂級模板，支持分頁編輯、多尺寸導出與 Minimax AI 配音配樂，無需 API Key 可本地運行。

html-video的主要功能

• 模板化視頻生成：內置 20 多套頂級 HTML 視頻風格模板，覆蓋產品宣傳、知識解說、數據可視化等場景，Agent 可直接調用生成動態 MP4。
• 分頁編輯與預覽：Studio 編輯器支持分頁預覽、分頁編輯和幀級文字修改，無需反覆導出查看效果，修改效率大幅提升。
• 多尺寸適配：一鍵切換橫屏 16:9、豎屏 9:16、方形 1:1、小紅書 4:5 等主流視頻規格，適配全平台分發需求。
• Agent 無縫接入：自動識別本地 6 種 Code Agent CLI（Codex、Claude Code、Hermes、Cursor Agent 等），頂部欄一鍵切換，零配置即用。
• AI 配音配樂：已接入 Minimax，支持根據視頻內容自動生成旁白配音與背景音樂，Token 消耗低，成本可控。

如何使用html-video

• 克隆倉庫：從 GitHub 拉取 html-video 開源項目到本地。
• 安裝依賴：運行安裝命令，配置本地環境，無需申請任何 API Key。
• 啓動 Studio：打開本地可視化編輯器，瀏覽 20+ 內置模板並選擇適合的風格。
• 輸入內容：將網站鏈接、文件或公衆號文章等內容交給 Agent，自動生成 HTML 視頻腳本。
• 分頁精修：在 Studio 中逐頁預覽、編輯文字與畫面，實時調整細節。
• 導出 MP4：確認無誤後一鍵導出高清視頻，或直接生成配音配樂後下載。

html-video的核心優勢

• 本地優先，零 API 成本：完全本地運行，不依賴雲端 API Key，數據隱私有保障，長期使用成本極低。
• Agent 原生設計：專爲 Code Agent 工作流打造，支持主流 CLI 工具一鍵切換，讓 AI 自動完成從內容到視頻的全鏈路。
• HTML 驅動，極低成本：用 HTML/CSS 替代傳統視頻工程，3 萬行代碼即可實現剪映級體驗，技術門檻與維護成本遠低於專業視頻軟件。
• 實時迭代，所見即所得：分頁編輯模式支持逐幀修改與實時預覽，避免傳統視頻工具”修改-渲染-檢查”的低效循環。

html-video的項目地址

• GitHub倉庫：https://github.com/nexu-io/html-video

html-video的同類競品對比

html-video的應用場景

• 知識博主內容量產：將公衆號文章、技術文檔自動轉爲帶配音的知識解說視頻，適配小紅書 4:5、B站 16:9 等多平台規格。
• 產品宣傳視頻：輸入產品官網鏈接，Agent 自動提取賣點並生成動態產品展示視頻，適合初創團隊快速製作營銷物料。
• 數據可視化報告：將 CSV/JSON 數據轉化爲動態圖表視頻，用於彙報演示、社交媒體傳播，避免靜態圖表的枯燥感。
• 電商內容創作：批量生成商品介紹、使用教程等短視頻，配合 Minimax AI 配音，實現低成本、高效率的內容矩陣運營。