MCP Servers

flash-cast-mcp

A deterministic video rendering engine that enables AI agents to create programmable, reproducible videos via MCP protocol.

README

Flash Cast MCP

AI 的视频渲染引擎 · 你出想法，我出成品

The deterministic rendering backend for AI-generated video. 当 AI 会写 HTML，它就能做视频。

这是什么

Flash Cast MCP 不是一个视频剪辑工具，也不是又一个"AI 一键生视频"。

它是你（AI Agent）专属的渲染引擎：

你负责想——一个概念、一段洞察、一本书的摘要、一条新闻的解读；
它负责 像素级把它呈现在视频里——画面、动画、配音、声画同步、成片、分发链接，全部交付。

在 2026 年生成式视频满天飞的今天，真正稀缺的不是"能拍出什么"，而是：

同一个想法，每次渲染都完全一样。可复现、可迭代、可嵌进任何 AI 工作流。

这就是 Flash Cast 给 AI 留的位置。

它解决什么问题

当你让一个 AI Agent "把这条新闻做成短视频"时，它过去只有三条路：

调用生成式视频模型（Veo / Kling / 即梦 / Runway…）—— 擅长氛围，讲不清结构化知识，同一个 prompt 每次结果不同，改第 3 秒的一个字都要重抽卡；
调用数字人口播工具（HeyGen / Synthesia…）—— 一张脸 + TTS，模板感一眼识别；
教人怎么用剪映—— AI 退化成教程作者。

Flash Cast 给了第四条：

	生成式视频模型	AI 数字人	剪映 / CapCut	Flash Cast MCP
AI 的角色	写 prompt	选模板	当助手	作者 + 导演
输出是否确定	<svg width="15" height="15" style="vertical-align:-0.2em;color:#dc2626"><use href="#fc-x"/></svg> 每次不同	<svg width="15" height="15" style="vertical-align:-0.2em;color:#16a34a"><use href="#fc-check"/></svg> 但模板僵	<svg width="15" height="15" style="vertical-align:-0.2em;color:#16a34a"><use href="#fc-check"/></svg> 但人主导	<svg width="15" height="15" style="vertical-align:-0.2em;color:#16a34a"><use href="#fc-check"/></svg> 同输入同输出
控制粒度	prompt 级	模板级	帧级（手工）	CSS 级可编程
迭代一个细节	重抽卡	只能重录	手工调整	改一行 CSS
结构化知识表达	<svg width="15" height="15" style="vertical-align:-0.2em;color:#dc2626"><use href="#fc-x"/></svg> 画不出公式	<svg width="15" height="15" style="vertical-align:-0.2em;color:#ca8a04"><use href="#fc-warn"/></svg> 只靠字幕	<svg width="15" height="15" style="vertical-align:-0.2em;color:#ca8a04"><use href="#fc-warn"/></svg> 需要素材	<svg width="15" height="15" style="vertical-align:-0.2em;color:#16a34a"><use href="#fc-check"/></svg> 任意图示 / 动画
AI 调用接口	API / GUI	API / GUI	GUI	MCP 原生

一句话：其他工具是"AI 辅助的视频生产"，Flash Cast 是"视频生产的 AI 化"。

为什么是 HTML

HTML 在这里不是产品主体，而是协议——AI 和渲染引擎之间的传输层。它被选中的原因非常硬核：

所有大模型都在海量 HTML 上训练过——让 AI 写一页幻灯片，比让它写一段 Sora prompt 容易 10 倍；
CSS 已经把"动画 / 布局 / 响应式 / 视觉"解决完了——引擎不用再发明一套 DSL；
幂等 + 可 diff——用户说"第 3 页红色改成蓝色"，AI 只需改 --primary 变量，像素级重现；
本地可预览 / 零依赖——AI 写完可以直接浏览器打开核对，不用先渲染一遍才看得见。

就像 LaTeX 是"公式的协议"、SVG 是"矢量图的协议"，Flash Cast 把 HTML 定为**"可动态视频的协议"**。

<svg width="20" height="20" style="vertical-align:-0.25em;color:currentColor" aria-hidden="true"><use href="#fc-film"/></svg> 能做成什么样

README 里 <video> 何时可用？ src 为 https://github.com/user-attachments/assets/<uuid>（在 GitHub 网页编辑 README 时拖入 MP4 上传得到）时，与 Pixelle-Video 一样可内嵌播放。若 src 指向仓库内路径或 raw.githubusercontent.com，GitHub 常会去掉 <video> 或体验不佳；那种情况请用 blob 文件页 或 OSS。

下方两个成片已用附件地址内嵌；npm 首页对 <video> 支持可能弱于 GitHub，以 GitHub 仓库页为准。仓库内同名源文件见各 Demo 下「blob / raw」链接。

Demo 1 · 科普短片

<p align="center"> <video src="https://github.com/user-attachments/assets/10aecd0d-c9bb-493d-abda-7e5138180d60" controls width="720"></video> </p> <p align="center"> <a href="https://github.com/trtian/flash-cast-mcp/blob/main/examples/demo-planet-gravity.mp4">仓库内视频（blob）</a> · <a href="https://raw.githubusercontent.com/trtian/flash-cast-mcp/main/examples/demo-planet-gravity.mp4">下载 raw MP4</a> </p>

《引力弯出轨道 · 星球为何在旋转里被捕获》 · 5 页深空视觉 · 源码：examples/planet-gravity.html

Demo 2 · 小学数学动画课

<p align="center"> <video src="https://github.com/user-attachments/assets/64d48c97-9465-416b-b5d3-807bfc24b3fd" controls width="720"></video> </p> <p align="center"> <a href="https://github.com/trtian/flash-cast-mcp/blob/main/examples/%E5%B0%8F%E5%AD%A6%E6%95%B0%E5%AD%A6%20%C2%B7%20%E5%88%86%E6%95%B0%E7%9A%84%E7%A7%98%E5%AF%86_2026-04-22_19-10-11.mp4">仓库内视频（blob）</a> · <a href="https://raw.githubusercontent.com/trtian/flash-cast-mcp/main/examples/%E5%B0%8F%E5%AD%A6%E6%95%B0%E5%AD%A6%20%C2%B7%20%E5%88%86%E6%95%B0%E7%9A%84%E7%A7%98%E5%AF%86_2026-04-22_19-10-11.mp4">下载 raw MP4</a> </p>

纯 CSS、零 JS、零依赖的 7 页《分数的秘密 · 1/2 到底是多大？》——三年级经典知识点，用蛋糕 / 披萨 / 切饼动画把抽象的分数讲清楚：

<svg width="16" height="16" style="vertical-align:-0.2em;color:#ea580c" aria-hidden="true"><use href="#fc-cake"/></svg> 开场故事：姐弟俩分蛋糕，用 emoji + 切刀动画引入；
<svg width="16" height="16" style="vertical-align:-0.2em;color:#6366f1" aria-hidden="true"><use href="#fc-hash"/></svg> 分子 / 分母：圆饼动态切 4 份涂 1 份，配分数符号从下往上拼入；
<svg width="16" height="16" style="vertical-align:-0.2em;color:#0d9488" aria-hidden="true"><use href="#fc-puzzle"/></svg> 对比演示：2 / 3 / 4 / 8 份并排切给你看，直观呈现"分得越多，每份越小"；
<svg width="16" height="16" style="vertical-align:-0.2em;color:#dc2626" aria-hidden="true"><use href="#fc-x"/></svg> 反例警告：不等分的圆饼 + 红色"X"弹入，强调"平均分"前提；
<svg width="16" height="16" style="vertical-align:-0.2em;color:#2563eb" aria-hidden="true"><use href="#fc-ruler"/></svg> 比大小：3/8 vs 5/8 圆饼 + 同步条形图双路呈现；
<svg width="16" height="16" style="vertical-align:-0.2em;color:#7c3aed" aria-hidden="true"><use href="#fc-clock"/></svg> 生活场景：时钟、披萨、巧克力、零花钱，分数就在身边。

源码：examples/math-fractions.html · 浅色暖调，家长 / 老师 / 自学儿童都能看懂。

在 Cursor 里对 AI 说一句「用 flash-cast 把 examples/math-fractions.html 做成视频，温柔女声、儿童语气、每页停 10 秒」，就能得到同款成片。

典型场景

不再是"上传 HTML"，而是 你（AI）要表达什么：

场景	AI 做的事	产出
<svg width="16" height="16" style="vertical-align:-0.2em;color:#2563eb" aria-hidden="true"><use href="#fc-books"/></svg> 知识科普	把一个概念写成 5 页带动画的讲解	适合 B 站 / YouTube 的横屏短片
<svg width="16" height="16" style="vertical-align:-0.2em;color:#7c3aed" aria-hidden="true"><use href="#fc-cap"/></svg> AI 小课堂	把一份技术笔记切成 7 页课程	技术社区 / 公众号配套视频
<svg width="16" height="16" style="vertical-align:-0.2em;color:#64748b" aria-hidden="true"><use href="#fc-newspaper"/></svg> 新闻速览	把一条新闻拆成导语 + 3 个要点 + 观点	抖音 / 小红书竖屏口播
<svg width="16" height="16" style="vertical-align:-0.2em;color:#d97706" aria-hidden="true"><use href="#fc-book"/></svg> 读书笔记	把一本书金句 + 观点做成情绪化分享	小红书 / 朋友圈传播素材
<svg width="16" height="16" style="vertical-align:-0.2em;color:#db2777" aria-hidden="true"><use href="#fc-brain"/></svg> 行业洞察	把一份分析做成可视化图表 + 结论	LinkedIn / 知识星球
<svg width="16" height="16" style="vertical-align:-0.2em;color:#0f766e" aria-hidden="true"><use href="#fc-brief"/></svg> 产品介绍	把 Changelog 做成发布视频	官网 / Twitter / 微信

共同点：输入是"想法"，输出是"可直接分发的视频资产"。中间全部交给 AI + Flash Cast。

<svg width="20" height="20" style="vertical-align:-0.25em;color:currentColor" aria-hidden="true"><use href="#fc-bolt"/></svg> 30 秒接入

Cursor

在 ~/.cursor/mcp.json 里加一段：

{
  "mcpServers": {
    "flash-cast": {
      "command": "npx",
      "args": ["-y", "flash-cast-mcp"]
    }
  }
}

重启 Cursor → 对 AI 说「用 flash-cast 登录」→ 本机浏览器弹出 http://127.0.0.1:18888/auth → 手机号 + 验证码 → 回到对话继续。

Claude Code

claude mcp add flash-cast -- npx -y flash-cast-mcp

任意 MCP 客户端

npx -y flash-cast-mcp

装完之后，你不需要再学任何东西——对 AI 直接描述你想要的视频即可，它会自己调用 12 个工具走完整条管线。

<svg width="20" height="20" style="vertical-align:-0.25em;color:currentColor" aria-hidden="true"><use href="#fc-toolbox"/></svg> MCP 工具清单（AI 视角）

工具	一句话描述	耗算力
`authenticate`	校验 Key / 本机登录并自动写入	—
`list_templates`	（可选）官方 HTML 模板库	—
`get_template_detail`	查看某个模板的设计规范	—
`create_project`	新建一个视频项目	—
`upload_html`	上传 HTML（AI 自己写的），返回分页摘要	—
`upload_material`	上传图片/视频素材到 OSS（视频自动转码 H.264）	—
`get_material_guidelines`	查看素材时长、pageMarks 与嵌入视频的约定	—
`list_voices`	枚举可用 TTS 音色 + 标签	—
`configure_voice_and_script`	配音 + 口播文案 + pageMarks + 多人配音 + page_holds	—
`get_render_preview`	渲染前只读预览（强制人工确认）	—
`render_video`	触发 TTS + 浏览器级录屏（约 2–10 min）	<svg width="15" height="15" style="vertical-align:-0.2em;color:#16a34a"><use href="#fc-check"/></svg>
`re_render_video`	修改内容后强制重新渲染（会扣额度）	<svg width="15" height="15" style="vertical-align:-0.2em;color:#16a34a"><use href="#fc-check"/></svg>
`get_render_status`	查进度 / 拿下载链接	—
`analyze_douyin_video`	抖音爆款拆解（ASR + 结构分析）	<svg width="15" height="15" style="vertical-align:-0.2em;color:#16a34a"><use href="#fc-check"/></svg>

「耗算力」= 后端消耗 TTS / 渲染 / ASR / LLM 资源，新用户注册即送 Pro 会员 30 天试用（限前 100 名），试用期享 150 次渲染额度。

<svg width="20" height="20" style="vertical-align:-0.25em;color:currentColor" aria-hidden="true"><use href="#fc-cycle"/></svg> 典型工作流

<pre style="white-space:pre;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:0.9em;line-height:1.45">authenticate ↓ create_project ↓ upload_material ← 可选：上传图片/视频素材（视频自动转码 H.264） ↓ upload_html ← AI 把它刚写的 HTML 上传（可内嵌素材 URL） ↓ list_voices ← AI 按内容调性自动挑音色 ↓ configure_voice_and_script ← <svg width="14" height="14" style="vertical-align:-0.15em;color:#ca8a04" aria-hidden="true"><use href="#fc-warn"/></svg> page_marks + voice_assignments（多人配音）+ page_holds ↓ get_render_preview ← <svg width="14" height="14" style="vertical-align:-0.15em;color:#ca8a04" aria-hidden="true"><use href="#fc-warn"/></svg> 用户浏览器核对，必须确认 ↓ render_video (user_confirmed_content: true) ↓ get_render_status ← 轮询到 COMPLETED → 下载链接 ↓ re_render_video ← 可选：修改内容后重新渲染 </pre>

三条关键护栏：

AI 自主分页：多页 HTML 的 page_marks（口播字符区间 → 页）由对话中的 AI 自己决定断点，不是服务端黑盒。优先在标点后切换；
渲染前强制预览：后端会拒绝未经 get_render_preview 确认的渲染请求（返回 preview_not_confirmed），避免浪费算力；
素材自动转码：上传的视频素材在后端自动转码为 H.264 MP4，确保渲染引擎（Google Chrome headless）兼容。

<svg width="20" height="20" style="vertical-align:-0.25em;color:currentColor" aria-hidden="true"><use href="#fc-pen"/></svg> HTML 规范（写给前端同学 / 想贡献模板的你）

不懂也可以。引擎只看两条硬规则：

分页：根容器 .slides-container 里，每页一个 .slide；首页带 .active。引擎会按 pageMarks 时间轴依次加 / 去 .active；
动画触发：入场动画挂在 .slide.active .anim-in { animation: ... } 上，页切到 active 时自动重新播放。

两个骨架可直接抄：

深色科技风（科普短片）：examples/planet-gravity.html
浅色暖调风（小学课堂）：examples/math-fractions.html

<svg width="20" height="20" style="vertical-align:-0.25em;color:currentColor" aria-hidden="true"><use href="#fc-cog"/></svg> 环境变量

变量	说明	默认值
`FLASH_CAST_API_KEY`	API Key（可选；未配置时走本机登录页）	—
`FLASH_CAST_API_BASE`	后端 API 根地址	`https://share.skyxhome.com`
`FLASH_CAST_FRONTEND_BASE`	定价等跳转用的前端根地址	同 API_BASE
`FLASH_CAST_LOCAL_PORT`	本机登录页 / 预览页 / 进度页端口	`18888`

登录页、预览页、进度页都由 MCP 在本机起 HTTP 服务；只有其中的 API 请求发往 FLASH_CAST_API_BASE——所以默认即「本机 UI + 线上后端」。

<svg width="20" height="20" style="vertical-align:-0.25em;color:currentColor" aria-hidden="true"><use href="#fc-lock"/></svg> 认证流程

调用 authenticate
  ↓
MCP 在 127.0.0.1:18888 开 /auth
  ↓
用户输入手机号 / 验证码
  ↓
MCP 转发到 FLASH_CAST_API_BASE/api/auth/*
  ↓
登录成功 → MCP 调 /api/keys 自动创建 API Key
  ↓
写入 ~/.flash-cast-mcp.json，下次免登录

（保留 /callback?token= 路径兼容旧版网页跳转。）

<svg width="20" height="20" style="vertical-align:-0.25em;color:currentColor" aria-hidden="true"><use href="#fc-wallet"/></svg> 会员

类型	能力
<svg width="15" height="15" style="vertical-align:-0.2em;color:#7c3aed" aria-hidden="true"><use href="#fc-cake"/></svg> 新用户试用	注册即送 Pro 会员 30 天（限前 100 名），含 150 次渲染额度
订阅会员	Starter（30 次/月） / Pro（150 次/月） / Business（500 次/月）
付费用户	按渲染扣费

触发付费时，工具结果会带 pricingUrl，AI 可以直接发给用户。

<svg width="20" height="20" style="vertical-align:-0.25em;color:currentColor" aria-hidden="true"><use href="#fc-bolt"/></svg> 最近更新

v1.5 — 2026-04-23

<svg width="15" height="15" style="vertical-align:-0.2em;color:#16a34a" aria-hidden="true"><use href="#fc-check"/></svg> 嵌入视频：HTML 里的 <video> 标签现在能在成片中正常播放（渲染引擎切换到 Google Chrome，支持 H.264）
<svg width="15" height="15" style="vertical-align:-0.2em;color:#16a34a" aria-hidden="true"><use href="#fc-check"/></svg> 素材上传 + 自动转码：upload_material 上传图片/视频，视频自动转码为 H.264 MP4，确保渲染兼容
<svg width="15" height="15" style="vertical-align:-0.2em;color:#16a34a" aria-hidden="true"><use href="#fc-check"/></svg> 多人配音：voice_assignments 支持每页指定不同音色，实现对话 / 多角色口播
<svg width="15" height="15" style="vertical-align:-0.2em;color:#16a34a" aria-hidden="true"><use href="#fc-check"/></svg> 画面停留（page_holds）：TTS 段后可插入静音停留或旁白，用于视频展示、留白节奏
<svg width="15" height="15" style="vertical-align:-0.2em;color:#16a34a" aria-hidden="true"><use href="#fc-check"/></svg> 重新渲染：re_render_video 修改内容后可重新渲染，无需新建项目
<svg width="15" height="15" style="vertical-align:-0.2em;color:#7c3aed" aria-hidden="true"><use href="#fc-cake"/></svg> 注册送 Pro：前 100 名注册用户自动获赠 Pro 会员 30 天试用（150 次渲染额度）
<svg width="15" height="15" style="vertical-align:-0.2em;color:#16a34a" aria-hidden="true"><use href="#fc-check"/></svg> 成品永久链接：渲染完成的视频下载链接不再过期

<svg width="20" height="20" style="vertical-align:-0.25em;color:currentColor" aria-hidden="true"><use href="#fc-hands"/></svg> 贡献

欢迎 issue / PR，尤其是：

更多 HTML 示例（不同主题、不同视觉风格）放到 examples/ 下
更多 MCP 客户端接入文档（Claude Desktop、Windsurf、Cline、Continue、Gemini CLI…）
多语言 README（英 / 日 / 韩）

提交示例请保持单文件、零依赖、浏览器直接打开即可预览。

<svg width="20" height="20" style="vertical-align:-0.25em;color:currentColor" aria-hidden="true"><use href="#fc-mail"/></svg> 联系

产品主页：https://share.skyxhome.com
Bug / 建议：GitHub Issues

License

MIT © Flash Cast

Recommended Servers

playwright-mcp

A Model Context Protocol server that enables LLMs to interact with web pages through structured accessibility snapshots without requiring vision models or screenshots.

Official

Featured

TypeScript

Magic Component Platform (MCP)

An AI-powered tool that generates modern UI components from natural language descriptions, integrating with popular IDEs to streamline UI development workflow.

Audiense Insights MCP Server

Enables interaction with Audiense Insights accounts via the Model Context Protocol, facilitating the extraction and analysis of marketing insights and audience data including demographics, behavior, and influencer engagement.

VeyraX MCP

Single MCP tool to connect all your favorite tools: Gmail, Calendar and 40 more.

Official

Featured

Local

graphlit-mcp-server

The Model Context Protocol (MCP) Server enables integration between MCP clients and the Graphlit service. Ingest anything from Slack to Gmail to podcast feeds, in addition to web crawling, into a Graphlit project - and then retrieve relevant contents from the MCP client.

Official

Featured

TypeScript

Kagi MCP Server

An MCP server that integrates Kagi search capabilities with Claude AI, enabling Claude to perform real-time web searches when answering questions that require up-to-date information.

Official

Featured

Python

E2B

Using MCP to run code via e2b.

Official

Featured

Neon Database

MCP server for interacting with Neon Management API and databases

Official

Featured

Exa Search

A Model Context Protocol (MCP) server lets AI assistants like Claude use the Exa AI Search API for web searches. This setup allows AI models to get real-time web information in a safe and controlled way.

Official

Featured

Qdrant Server

This repository is an example of how to create a MCP server for Qdrant, a vector search engine.

Official

Featured