Guide / HTML 动画
HTML 动画
用 HTML、CSS 与 JavaScript 制作的动画模板：浏览器中即时预览，免费下载源码，可用于视频包装、直播图文与网页动效。
什么是 HTML 动画
HTML 动画是用网页技术（HTML + CSS + JavaScript）制作的动态图形：它们运行在浏览器引擎中逐帧绘制，可以做到与合成软件同样精致的广播级效果，同时体积小、可实时改字改色、易于接入任意渲染管线。
在线预览，所见即所得
ograf.app 上的每个动画都能在浏览器中直接播放：消息协议驱动 start / stop / update，文字、颜色与数据字段实时生效。先预览效果，再决定是否下载。
下载后在哪里使用
下载的模板可以导入 CasparCG、OBS、vMix 等支持 HTML 的渲染器播出，也可以接入 Hyperframes、Remotion 或自研 Node/Python 渲染管线做程序化视频生产。
按分类浏览
查看全部最新模板
查看全部常见问题
HTML 动画和视频文件有什么区别？
视频文件是烘焙好的画面，HTML 动画是一段可运行的代码：文字、配色、时长都是参数，一套模板可以批量生成不同内容的图形，适合数据驱动的场景。
下载的 HTML 动画可以商用吗？
每个动画都带有明确的许可证（如 CC-BY、MIT 等），下载前请查看详情页的许可证信息并遵守对应条款。
没有编程基础可以使用吗？
可以。社区动画都提供可编辑的数据字段，复制到工作区后在表单里修改文字、颜色等属性即可，无需写代码。