HyperFrames 中文文档

编写 HTML，渲染 视频

Hyperframes 是一个开源框架，能够将 HTML 转换为确定性的逐帧渲染视频——让你像构建网页一样定义视频。为 AI Agent 而生，合成即普通 HTML。

快速开始

GitHub

# 创建项目
npx hyperframes init my-video
cd my-video

# 预览
npx hyperframes preview

# 渲染为 MP4
npx hyperframes render --output output.mp4

核心功能特性

    HTML 即视频

    合成就是带有 data 属性的 HTML 文件。没有自定义 DSL，没有专有组件系统，不需要 React。如果你能构建网页，就能构建视频。

    为 AI Agent 而生

    Agent 天然理解 HTML。CLI 默认非交互模式——所有输入通过参数传递，纯文本输出——Agent 可以在无需提示的情况下驱动每条命令。

    确定性渲染

    frame = floor(time * fps)——每一帧通过 Chrome 的 beginFrame API 独立捕获，相同输入始终产生完全一致的输出。

    50+ 组件库

    社交叠加层、着色器转场、数据可视化、字幕动画和影视特效——一条命令即可安装到你的合成中。

    多格式输出

    渲染为 MP4、MOV（ProRes 4444 透明视频）、WebM 或 PNG 序列。支持 GPU 加速、Docker 确定性和 4K/HDR。

    动画生态

    使用 GSAP、Lottie、CSS 过渡或 WAAPI 添加动画。通过 Frame Adapter 模式集成任何支持帧定位的运行时。

了解更多

快速上手

    1. 搭建项目

    npx hyperframes init my-video 启动交互式向导，选择示例并导入媒体文件。

    1. 浏览器预览

    npx hyperframes preview 启动 Studio，编辑 HTML 后即时看到变更——无需构建步骤。

    1. 渲染输出

    npx hyperframes render --output output.mp4 生成最终视频。支持本地和 Docker 两种模式。

查看完整教程