30秒速读：问一个复杂问题，常常只得到一堵文字墙，时序关系和对比结果都难一眼看懂。本篇讲这款工具如何让模型只写一份短稿，再由自带工具排成一页可保存的单文件页面，包括组件挑法、主题、出图速度与上手要点。
Answer me with HTML 让 Agent 遇到复杂问题时不再甩一堵文字墙，而是直接交一页能看懂的 HTML——它是一个装在编程助手身上的 Agent Skill，以 MIT 协议发布。模型不再手写几百行 HTML，而是先写一份很短的 Markdown 稿件，排版、配色、画图都交给 skill 自带的 CLI 完成。
项目托管在 GitHub，上线半个月已积累近 4000 Star，兼容 Claude Code、Codex、Cursor 等 70 多种 Agent，是一个把 AI 回答变成可保存页面的 AI 应用。
场景痛点
问 AI 一个稍微复杂的问题，比如 TCP 三次握手、Redis 怎么选，回复常常是一大段滚动的文字：时序关系靠脑补，表格对不齐，看完就忘。直接让它输出 HTML 又慢，等一页排版要半分钟，大量时间花在每次都差不多的 CSS 和 SVG 坐标上。内容和排版混在一起，读的人累，写的模型也累。
主要功能特点
模型只写 Markdown 稿件
数了 9 页模型手写的 HTML，平均 4893 token，近半是 SVG 坐标，正文只占两成。用这个 skill，模型只写约 612 token 的稿件，约八分之一，中位数从 31 秒降到 12 秒。数字来自 3 题各 3 次的复现基准，CLI 约 50 毫秒出页，花费只省一成五，系统提示与对话每轮照读。
按信息形状挑组件
内置十几种组件：flow 画架构和调用链并自动布局，sequence 画时序，er 画数据模型，tree 画目录，timeline 画时间线，chart 用数字表格画柱线饼图；对比表写 ok/no 自动变勾叉，还有结论框和页面内做决定的 ask。图形坐标用 dagre 算，不靠模型猜，箭头不会指空，文字不截断。
单文件零依赖的页面
产物是单个 .html，不引 CDN 或外部字体，断网可开、转发可看，默认存 ~/.answer-me-with-html/pages/。自带 blueprint、shadcn、paper 三种主题，各有亮暗两色，CLI 按内容自选，也可自写主题。支持简繁中、英、日文，每页内嵌 Markdown 稿。
3b1b 风格讲解视频
Karpathy 说的理解阶梯顶端是 3b1b 风格解释视频。一句”给 TCP 握手做 3b1b 视频”，模型在稿件加旁白，am video 生成播放页，图随旁白画，镜头跟节点走。配音内嵌页面，带章节和倍速；WebM 浏览器本地编码、免 ffmpeg，MP4 才需要。小测试中输出 token 少约 18 倍、快约 12 倍。
真实代码与页内回复
代码块可以用 src 和 lines 直接引用你文件里的真实代码，页面上展示的不是手抄版本；当前目录之外和存放密钥的文件会被拒绝，避免把敏感内容带进页面。你可以对任意面板写评论，也能在 Agent 给出的决定里勾选项，点回复后合成一段文字贴回给 Agent。稿件写错时 CLI 会报出行号、组件名和正确示例，Agent 照着改一次就能重新渲染。
STE100 受控写作检查
ASD-STE100 原本是飞机维修手册的受控英语规范：句子别太长、一个词只表达一个意思、步骤用祈使句。每次渲染都会按这个思路检查稿件，句长、常用词、被动语态，以及中文错别字和含糊词都会提醒，默认只提示不拦截；调成 strict 模式后，不达标的稿件直接不生成。规则在参考文档里可以逐条查。
一键安装与高频模式
Node 20 以上即可，CLI 已打包在 skill 内，免安装；让 Agent 读安装说明即可，也支持 npx 或插件市场。面向 70 多种能跑 shell 的 Agent，不限聊天应用。高频模式下，每轮结论、方案、对比都附 2 到 4 面板小页，只生成不弹窗；更新每天最多查一次，不上传内容。
开源地址
GitHub 国内访问较慢，如打不开可多刷新几次
软件信息一览
| 版本 | 以官网为准 |
| 大小 | 以官网为准 |
| 平台 | 需 Node 20 以上；兼容 70 多种能跑 shell 的 Agent |
| 语言 | 简繁中文、英文、日文 |
| 更新日期 | 以官网为准 |
版本对比与推荐
| 版本路径 | 特点 | 适合谁 | 推荐 |
|---|---|---|---|
| 最新发布版 | 开箱即用，功能稳定 | 大多数使用者 | 推荐 |
| 源码与开发分支 | 能提前试新功能，但稳定性以官网说明为准 | 想改代码或提前试新功能的人 | 不推荐日常使用 |
推荐版本：优先用最新发布版，稳定可用；开发分支只适合想改代码的人，日常使用不必追新。
安装步骤
- 确认环境：本机装好 Node 20 以上版本，这是运行的前提条件。
- 装好这款 Skill：让 Agent 阅读安装说明完成接入，也支持从 npx 或插件市场安装，具体入口以官网说明为准。
- 先试一页简单内容：提一个带对比或流程的问题，看 CLI 是否在数秒内输出单文件页面，确认链路通畅。
- 再开高频模式：确认单页效果符合预期后，再按需开启高频模式，让每轮结论附带小页。
必改设置
设置一：主题与亮暗风格
入口：生成页面的主题设置。差别：自带三种主题、各有亮暗两色，CLI 会按内容自选，也可以自写主题；对外分享前先定一种风格，整套页面看起来才统一。
设置二：受控写作检查模式
入口：写作检查的模式设置。差别：默认只提示不拦截，适合日常起草；严格模式下不达标的稿件直接不生成，适合对外发布前把关，句长与含糊词会在生成前被拦下。
设置三：高频模式与更新检查
入口：高频模式开关与更新检查设置。差别：高频模式下每轮结论、方案、对比都附 2 到 4 面板小页，适合连续追问；更新每天最多检查一次，且不上传内容，介意联网检查的人可以关掉它。
注意事项与常见问题
- 出图快不等于花费省很多：原文基准里花费只省一成五，因为系统提示与对话每轮照读；看中的主要是排版时间与可读性，不是省钱。
- 稿件写错先看报错：CLI 会报出行号、组件名和正确示例，照着改一次就能重新渲染，不用整篇重写。
- 敏感内容不会进页面：当前目录之外和存放密钥的文件会被拒绝引用，写稿时不要把密钥路径贴进稿件。
- 视频页需要另外确认：配音内嵌页面、浏览器本地编码 WebM，MP4 才需要另外工具，具体以官网说明为准。
关注「软件教程管家」
回复软件名即取即下：网盘下载链接 + 提取码，一步直达，不用再跳转。
本站资源仅供个人学习交流，请勿用于商业用途。软件与资料版权归原作者所有；如有侵权，请通过公众号「软件教程管家」联系我们，我们将在 24 小时内下架处理。查看免责声明 ›
