工具集

把自然语言描述、Mermaid 或真实代码仓库转成可交互的单文件 HTML 图表，覆盖架构图、流程图、时序图、数据流与状态机，生成后自动校验，可导出 PNG/SVG。

用 HTML、CSS 与可逐帧定位的动画写视频，命令行预览并渲染成确定性的 MP4；附带产品发布视频、字幕、口播重剪等 agent 技能。HeyGen 官方维护，需要 Node.js 22+ 与 FFmpeg。

HeyGen 官方 HyperFrames 技能集：让 agent 用 HTML、CSS 与动画写出可确定性渲染的 MP4 视频，含产品宣传片、讲解视频、字幕、配乐卡点等创作流程。需要 Node.js 22+ 与 FFmpeg。

生成自包含 HTML+SVG 的杂志风图表：架构图、流程图、时序图、泳道图、甘特图等数十种类型，可读取网站配色匹配品牌，支持导入 Mermaid、draw.io 与 Excalidraw 源文件重绘。

让 agent 生成单文件 HTML 交互式 playground：一侧是可视化控件，一侧是实时预览，底部输出可复制回 Claude 的提示词。内置设计调参、数据探索、概念图、文档批注、代码评审、代码架构图等模板。Anthropic 官方维护。

一句话让 agent 用 HTML 产出高保真可点击原型、可编辑幻灯片、时间轴动画（可导出 MP4/GIF）与信息图，先给三个设计方向再落地，附五维度设计评审。花叔出品，MIT 协议。

把架构说明、diff 评审、计划审查、数据对比等内容生成自包含的 HTML 页面或幻灯片，支持 Mermaid 图与深浅色主题，替代终端里的 ASCII 图表。

用 HTML 与 CSS 排版并导出 PDF 的渲染引擎，支持分页等打印样式标准，适合批量生成统计报告、发票与票据。Python 实现，依赖系统的 Pango 库。

为品牌、活动、出版物、网页或产品建立独立的视觉语言：从主题本身的语境出发，不参考当下的设计作品，只用字体、颜色与留白做出 10 个相互独立的 HTML 排版方向，由人看过后明确选定一个，再进入第二轮做成可投产的设计系统与成品。不适合日常界面修补、小组件或套用现有设计系统。