html-video is a local tool that turns HTML, CSS, and data into animated MP4 videos using configurable rendering engines and templates. Coding agents use it to create and export videos on a user's machine, with optional AI-generated soundtracks. The catalogue skills operate the tool and its video-generation workflow.
Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx agentmods add instructions/nexu-io/html-video/claude-mdgit clone --depth 1 https://github.com/nexu-io/html-videoWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/instructions/nexu-io/html-video/claude-md)<a href="https://agentmods.dev/instructions/nexu-io/html-video/claude-md"><img src="https://agentmods.dev/badge/instructions/nexu-io/html-video/claude-md.svg" alt="Measured on agentmods" height="20"></a>What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.06229 | $0.06229 |
| Opus 5 | $0.03114 | $0.03114 |
| Sonnet 5 | $0.01246 | $0.01246 |
| Haiku 4.5 | $0.00623 | $0.00623 |
Grade A, and why
html-video CLAUDE.md scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 6d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 224 lines — stays where its author put it; the contents beside it link to each section on GitHub.
html-video 项目工作区
Open-source HTML→Video meta-layer。让本地 coding agent 跨多个渲染 engine(Hyperframes / Remotion / Motion Canvas / Revideo)一站式做 HTML 视频。 启动时间:2026-05-26(继 OD / HA / OD-pitch / OD-landing 之后的下一代 nexu-io 开源产品)
角色与边界
- 角色:T9(端口段 3071-3079)—— 现有 T1-T8 已分配
- 职责:html-video 项目的产品定位 / 架构 / engine 适配器 spec / 模板生态 / agent skill 设计 / 文档 / 公开 launch 物料
- 不做:
- 跨项目协调(T1 主控的活)
- OD 主线开发(T5
open-design工作树) - 增长策略 / OKR(T2
opendesign-growth)
产品定位(决策时间线)
- 2026-05-26 启动思路:Joey 最初以为 Hyperframes 是闭源 SaaS,想做 "HTML 视频开源整合工具"。调研发现 Hyperframes 已经是 Apache-2.0 开源 + 21K★ + agent-native,跟 Joey 设想的产品 1:1 重合。
- 2026-05-26 定位拍板:放弃"做 HF 杀手"的正面竞争路线,改走 Meta-aggregator —— 把 HF / Remotion / Motion Canvas / Revideo 都包成可选 backend,agent 选 engine + 模板 + 一键出片。差异化明确,跟 HF 不正面撞。
关键差异化 vs Hyperframes
| 维度 | Hyperframes | html-video |
|---|---|---|
| 渲染引擎 | 单一(GSAP+Puppeteer) | 多引擎 pluggable |
| Authoring 范式 | 单一(HTML+CSS+GSAP) | 跟随 backend(HTML/React/TS-generator 都行) |
| Agent 能力 | 自家 skill | 跨引擎 agent 决策 + skill 注入 |
| 模板生态 | 自家曲库 | 跨生态 curated + 社区贡献 |
目录结构
html-video/
├── README.md 公开门面(对外,已立)
├── CLAUDE.md 本文件,内部 working notes
├── LICENSE Apache-2.0
├── .gitignore 通用
├── notes/ 迭代笔记 / RFC 草稿 / 决策记录
├── research/ 竞品调研 / engine spec 草案 / API 探索
└── assets/ 素材(截图 / 草图 / launch 物料)
代码骨架(adapter spec、CLI、studio 等)等架构定型后另起 core/ adapters/ cli/ studio/ 等目录。
当前状态(2026-05-28 v0.8 content-graph + multi-frame)
v0.7 之前的进展见 git log。本节记 v0.8 落地的事 + 还没接的事。
- ✅
@html-video/content-graph新 package:ContentGraph schema(entity/data/text 节点 + sequence/dependency/contrast 边)+validate+topoSort(dependency 硬约束 / sequence 软排 / contrast 不参与排序)+totalDurationSec - ✅ core:
Project加contentGraphPath+frames[];orchestrator加writeContentGraph/readContentGraph/writeFrameHtml;exportMp4多帧路径走 ffmpeg concat(缺 ffmpeg 时报友好错) - ✅ studio agent:prompt 同时教单帧 fast path + 多帧(```json#content-graph + ```html#<nodeId> 双块协议);server 解析后自动调 writeContentGraph + writeFrameHtml;无 graph 时回落 v0.7
- ✅ studio UI:frames-strip 切帧 + graph viewer modal(JSON 只读 + 下载);单帧 fast path 时整条隐藏
- ✅ 已 push
nexu-io/html-videomain(commit149ace9) - ⏳ HF upstream 真实 render(v0.9?):adapter-hyperframes 仍是 stub,单帧/多帧 export MP4 都是空文件
- ⏳ ffmpeg concat 真实跑通:依赖 ffmpeg 装好;adapter render 出真 MP4 之后才 end-to-end 有用
- ⏳ RFC-06 正式文档稿(落
research/2026-05-28-spec-06-content-graph.md);目前规范散在 content-graph package README + smoke + agent prompt 三处 - ⏳ studio 的 graph viewer 现在只读,未来可加可视化编辑(拖节点 / 加边)
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 6d ago First seen · 224 lines · 6,229 tokens per session scan A 1cd732aaae77
html-video CLAUDE.md is an instructions file published in the GitHub repository nexu-io/html-video (4,525 stars, last pushed 2mo ago), licensed Apache-2.0. It adds 6,229 tokens to every session, about $0.0311 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.
Other instructions, from other repositories
electron CLAUDE.md
Claude Code instructions for electron/electron, covering electron development guide, running nodemodules binaries, project overview, directory structure and build tools setup.
hyperframes CLAUDE.md
Claude Code instructions for heygen-com/hyperframes, covering hyperframes, skills, creation workflows, domain skills (loaded on demand) and skill catalog maintenance.
hyperframes AGENTS.md
AGENTS.md instructions for heygen-com/hyperframes, covering hyperframes, skills, build & test, linting & formatting and composition validation.
skelet AGENTS.md
Instructions for Selekkt/skelet, covering agents.md — developing skelet.css, what skelet is, source of truth, repo map and rules of engagement (framework dev).
mis-recursos-webdev AGENTS.md
AGENTS.md instructions for Alplox/mis-recursos-webdev, covering agents.md — mis recursos web dev, 📋 stack, 🏗️ estructura del proyecto, 🧠 source of truth and estructura del readme.
starling AGENTS.md
Instructions for starling-browser/starling, covering agents — rules of engagement, tl;dr, 1. orient, 2. claim something unblocked and 3. read the package file and start working on main.