什么值得做
GitHub 开源项目 · 11-6 写
QingYunA/answer-me-with-html · QingYunA

Karpathy 发帖 9 小时后,一个人把它做成了 5,000 星的技能:answer-me-with-html 赢在哪

它是什么 一个给 Claude Code、Codex、Cursor 用的技能:遇到复杂问题时不回一大段文字,而是出一页带图表的离线 HTML;模型只写 Markdown 草稿,自带的程序负责排版和画图。

为什么火了 它在 Karpathy 发帖 9 小时后上线,把帖子里四种形式一次做全,还用实测数据证明输出 token 只要约 1/8、耗时 31 秒降到 12 秒,正好堵住「又慢又费 token」的担心;再加 LINUX DO 推广帖、技能目录站和 AI 资讯站转载。

B你可以怎么跟 别再做一个「用 HTML 回答」,把「模型写草稿 + 程序渲染」换到幻灯片、图表、讲解视频、审查报告这类产出上,等下一条大 V 帖子当天上线,配可复跑的对比数据和一句话安装。

B 级:可抄的打法和结构很清楚,还能迁移到别的产出形式;但这一个方向本身已被万星老项目和它挤满,它吃到的 Karpathy 那波是一次性的,跟进者要赌下一条同量级的帖子和自己的渲染器功力。 小圈子里在传
数据(每天更新) · 建库 2026-10-02 · 5,993 星 · 7 天 +1,029
GitHub · 星数
02k4k6k10-0210-1610-2410-3111-086k
数据 2026-10-02 → 2026-11-08(38 天,32 次观测)。10-28 以前的点来自 deeply / 存档补录,不是每天都有

2026 年 10 月 2 日凌晨,Karpathy 在 X 上发了一条长帖,说以后我们会花很多时间去「读懂模型的输出」,并给了一个从低到高的阶梯:受控英语 ASD-STE100、图、HTML 网页、3b1b 风格的讲解视频。9 个小时后,GitHub 上多了一个叫 answer-me-with-html 的仓库。同一条帖子带出了十来个技能,大多停在几十到一百多颗星;这一个 35 天拿到 5,384 颗(每日 star 记录,11-06;GitHub 页面当天显示 5,700 出头)。差的不是时机,是一个工程决定和一套包装。下面说清楚它做对了什么,以及想让自己的开源项目也拿到星的人能抄哪几招。

那条帖子说了什么,它又做了什么

Karpathy 的原帖一层层往上加码:先让模型用 ASD-STE100(一种原本给航空维修手册用的受控英语)写,「但更好的是」让它画图,「更好的是」让它输出 HTML 网页,「更好的是」让它做 3b1b 风格的讲解视频,「这已经开始能用了」。

作者 Cyan(GitHub 账号 QingYunA,84 个粉丝,之前最好的作品只有 65 颗星)当天就把这四级全塞进一个技能。装好以后,你在 Claude Code、Codex、Cursor 里照常问「解释一下 TCP 三次握手」「这个仓库的模块怎么组织的」「缓存用 Redis 还是 Memcached」,回来的不再是一大段终端文字,而是一页离线单文件 HTML:时序图、状态图、对照表、结论。README 首行四个词「Super Fast | ASD-STE100 | Explainer Videos | One File, Offline」,topics 里直接挂着 ste100——帖子里每一个关键词都接住了。

它和其他十几个同类差在哪:模型只写草稿

看完 Karpathy 那条帖子,稍微试过的人第一反应都是:让模型手写一整页 HTML,又慢又费 token。同期的同类几乎都是一段提示词,让模型自己去写页面;连早半年出来、已经 10,820 颗星的 visual-explainer 也是模型手写整页。

answer-me-with-html 换了一条路:模型只写一份短的 Markdown 草稿,里面用几种组件块(时序、流程、ER 图之类)标出结构;仓库里自带一个 CLI,约 50 毫秒把草稿排成页面,SVG 的坐标、CSS、标签全由程序生成。README 把这件事算给你看:模型手写的 9 个页面平均 4,893 个 token,其中 47% 是 SVG 坐标和路径,文字只占 21%;换成这个技能,同样的问题平均 612 个 token,约 1/8,耗时从 31 秒降到 12 秒。数据和复跑脚本都在仓库里,它还老实写了一句:账单只降约 15%,因为每一轮还要读系统提示和上下文。

这正好堵在了所有人的第一个担心上。10 月 5 日它在 LINUX DO 的推广帖下面,一位网友的第一句回复是:「输出 token 可比输入 token 值钱。」

星是怎么来的

时间发生了什么当天新增 star(Trendshift)
10-02Karpathy 发帖(00:37 UTC),仓库创建(09:57 UTC)0
10-03几个技能目录站当天就收录+67
10-04Trendshift 全语言第 8、JavaScript 第 2+731
10-05作者在 LINUX DO 发《一天 1k star🔥!这个 Skill 让 Agent 输出可视化结果!》+437
10-06AlphaSignal、Hermes AI News 报道+293
10-14 起每天 50~100,发版和新文章带出小波峰—

10-04 那天 +731 具体是谁带的,外面拆不出来(GitHub 不公开 star 来源;X 上没找到大号点名转发)。之后的几条路是看得见的:

  • LINUX DO 开源推广帖:3.1k 次浏览、242 个赞、67 楼回复,README 里专门致谢了这个社区。帖子里写的还是「Token 消耗减少 7.4 倍,速度快 3.6 倍」,后来 README 换成了更保守的 8 倍和 2.6 倍——数字随复测在改,没有往大里吹。
  • 技能目录站被动收录:skills.sh、skillsllm、skillsdirectory 等十多个站。安装命令 npx skills add 背后的安装器支持 70 多种 agent,本身就是一个分发入口。11-03 作者一口气 fork 了 6 个 awesome 技能列表,看样子是要去提 PR 上榜。
  • 资讯站和中文技术博客:AlphaSignal、掘金、CSDN、公众号,标题多半直接带上 Karpathy 的名字。还有第三方的 YouTube Shorts、繁中的 Threads / Instagram 图解在转。

它没有停在第一波。36 天合并了 243 个 PR,从 v0.4 迭代到 v0.5.10;10-17 到 11-06 每天 star 从 3,514 涨到 5,384,最近 7 天 +681,比前 7 天的 457 还快(每日 star 记录,11-06)。热度没退,是被持续的发版和新文章续着。

包装也是产品的一部分

  • README 首屏一张图:左边是一整屏终端文字,右边是同一个问题的一页图解。不用读字就懂。
  • 一段 24 秒的带音乐演示视频,中英双语 README,一个独立官网。
  • 最聪明的一招是安装:「把这句话贴给你的 agent:读这个 INSTALL.md 并照做」。INSTALL.md 是写给 agent 看的,装完还会自己用 TCP 三次握手页面验一遍。用户一步都不用操作。
  • Claude Code 插件市场、DeepSeek Harness 插件、npx skills、手动复制,四个入口全备齐。

谁在抢,还剩什么空

项目star(11-06)和它的区别
nicobailon/visual-explainer10,820模型手写整页 HTML,偏 diff review 和计划审查;最近 7 天 +117
nexu-io/html-anything9,428Markdown 转公众号 / 小红书成品页,面向发布
danyuchn/asd-ste100-skill6,099只做阶梯第一级(STE100 写作),同样吃到了 10-02 的流量
plannotator/effective-html3,964顺着「HTML 取代 Markdown」做规格和计划文档
dualface/ste-zh874STE100 的中文版
understanding-ladder、karpathy-output-style 等同期技能24~121纯提示词,没有渲染器、没有 benchmark

「让 agent 用 HTML 回答」这件事本身已经挤了:头部有一万星的老项目,这一个又把 Karpathy 那波吃得差不多,已经有人在掘金发「基于 answer-me-with-html 改造」的衍生版。再做一个通用的「回答成页」技能,很难再拿到同样的星。

还空着的是这个模式的别处:「模型写结构化草稿,确定性程序负责排版和画图」。凡是现在让模型直接写成品代码、又慢又不稳的地方都能套——幻灯片、数据图表、海报、讲解视频、代码审查报告。它自己的讲解视频那部分,README 里的小测试是输出 token 少约 18 倍、快 12 倍,说明这个思路往别的形式迁移是成立的。

如果是你

一句话判断: 别再做一个「用 HTML 回答」,抄它的三样东西——大 V 帖子当天做全、用可复跑的数据回答第一个反对意见、「模型写草稿 + 程序渲染」这个结构——换一个产出形式去做。

  • 适合谁: 会写一点前端或渲染程序、手上有 Claude Code / Codex 这类 agent 日常在用的开发者;能盯着 X 上几个大号,有新说法当天就能动手。
  • 不适合谁: 只会写提示词、不打算写渲染器的人——同一条帖子带出的纯提示词技能,停在了几十颗星;也不适合想靠这个直接赚钱的人,它只挂了 Ko-fi 和爱发电打赏。
  • 怎么做: 挑一种模型直接写起来又慢又丑的产出(幻灯片、图表、短视频、PR 审查报告),写一个确定性的渲染 CLI,让模型只出几百个 token 的草稿;仓库里放可复跑的 token 和耗时对比,README 首屏放「之前 vs 之后」一张图,外加一段二十几秒的演示视频和一份写给 agent 读的 INSTALL.md。
  • 怎么获客: 中文先发 LINUX DO 的开源推广帖(按它的规矩打标签、致谢社区),同时上 npx skills 和 Claude Code 插件市场,让目录站被动收录;英文给 AlphaSignal 这类 AI 资讯投稿,给 awesome 技能列表提 PR;标题里带上那条帖子的作者名。
  • 什么时候之前: 现成的 Karpathy 这波已经过去一个月,别再追它;你要等的是下一条同量级的「试试这样用模型」的帖子,发出后 24 小时内上线,第三天之前发完社区帖。
  • 什么情况说明看错了: 如果你做出的渲染器版本在一周内连 200 颗星都拿不到,而同期纯提示词的同类反而涨得更快,说明这次赢的是时机和作者运气,不是「草稿 + 渲染器」这个结构,别再往这个方向投时间。

GitHub 仓库 ↗

研究底稿:竞品表、获客证据、完整研究报告
竞品
名字在哪上线规模它和这家不同在哪
nicobailon/visual-explainer开源2026-02-1610,820★,gain_7d 117模型手写整页 HTML,偏 diff review 和计划;没有渲染 CLI,不省 token
nexu-io/html-anything开源2026-05-119,428★Markdown 转公众号 / 小红书成品页,面向发布,不是回答问题
plannotator/effective-html开源2026-06-093,964★顺着 Thariq 'HTML 取代 Markdown' 做规格和计划文档
danyuchn/asd-ste100-skill开源2026-07-206,099★,gain_7d 291只做 STE100 写作这一级,也吃到了 Karpathy 的流量
ChangWenC/understanding-ladder 等 Karpathy 帖子同期技能开源2026-10-02~10-0524~121★纯提示词让模型选格式,没有渲染器、benchmark 和包装
Claude.ai Artifacts / ChatGPT Canvas大厂功能2024大只在聊天网页里;终端 coding agent 里没有原生的'回答成页'
用户从哪来
  • 查实 蹭大 V 帖子(Karpathy 10-02 X 帖):仓库在帖子发出 9 小时后创建;LINUX DO 帖和 AlphaSignal 都写明理念来自 Karpathy;topics 里有 ste100
  • 查实 GitHub Trending / Trendshift:10-04 Trendshift 全语言第 8、JS 第 2,当天 +731★
  • 查实 LINUX DO 开源推广帖:linux.do/t/topic/2984649,10-05 发,3.1k 浏览、242 赞、67 楼;README 致谢 LINUX DO
  • 查实 技能目录站 / npx skills / 插件市场:10-03 起被 skillsllm、skillsdirectory、skills.sh、typingmind 等十多个站收录;作者 11-03 fork 了 6 个 awesome 技能列表
  • 查实 AI newsletter / 资讯站 / 中文技术博客:AlphaSignal、Hermes 10-06,掘金 10-14 和 11-06,CSDN 10-08,公众号 Karpathy 相关文章
  • 推断 短视频 / 社媒转述:YouTube Shorts Forkcast、繁中 Threads / IG / FB / YouTube 图解、LinkedIn;是不是作者自己的矩阵未核实
  • 推断 X 大号转发:x-radar 语料里没搜到

QingYunA/answer-me-with-html 为什么能跑出来

数据日期 2026-11-06。渠道:GitHub。一句话:一个 Agent 技能,遇到复杂问题时让 Claude Code / Codex / Cursor 等不再回一大段文字,而是出一页带图表的单文件 HTML;模型只写 Markdown 草稿,自带的 CLI 负责排版和画图。

一、结论

它是 Karpathy 2026-10-02 那条 X 帖子"装进盒子"的最快、最完整的版本。Karpathy 当天凌晨(00:37 UTC)发帖,说理解 LLM 输出有一个从低到高的阶梯:ASD-STE100 受控英语 → 图 → HTML 网页 → 3b1b 风格讲解视频。作者 9 小时后(09:57 UTC)建了这个仓库,把阶梯上的四种形式全都塞进一个技能(topics 里直接写着 ste100,README 首行 "ASD-STE100 | Explainer Videos")。

同一条帖子带出了一批技能,大多拿到几十到一百多 star;它拿到 5,700+。原因主要在工程设计:别家是"让模型直接写 HTML",它是"模型写 Markdown,CLI 生成 HTML/SVG",README 拿实测数据说话(输出 token 约 1/8,耗时 31s→12s)。正好回答了大家看完 Karpathy 帖子的第一个担心:又慢又费 token。增长靠的是 LINUX DO 开源推广帖、一批技能目录站和 AI 资讯站的自动收录、中文和繁中短视频转述。

二、增长数据

时间事件新增 star(Trendshift 日表)
10-02Karpathy 发帖(00:37 UTC);仓库创建(09:57 UTC)0
10-03skillsllm、skillsdirectory、aiezz 等目录站当天就收录+67
10-04Trendshift 全语言第 8、JavaScript 第 2+731
10-05作者在 LINUX DO 发帖《一天 1k star🔥!这个 Skill 让 Agent 输出可视化结果!》+437
10-06AlphaSignal、Hermes AI News 报道+293
10-07~10-13每天 +140~280—
10-14 起回落到每天 50~100,10-19/20(+206/+197)、10-29/30(+142/+166)、11-06(+299)有小波峰—
  • 我们的 github 库:35 天 5,384 star,gain_7d 681,前一个 7 天 457;单日最高 247(库记录 10-11,和 Trendshift 口径不同)。11-06 用 GitHub API 实测是 5,703 star、370 fork。
  • Trendshift:36 天 +5,463 star,合并 PR 243 个。贡献者 23 人,作者本人 255 次提交;提交节奏很像 agent 驱动的开发,v0.4.x → v0.5.11 一共 21 个以上的版本。
  • 作者 GitHub 账号 Cyan / QingYunA,84 个粉丝,建于 2018 年。之前的作品 agent-html(2026-09-08,单文件 HTML 设计系统技能)只有 65 star,算是这个项目的前身。作者没有大号背书。

三、竞品

产品形态上线规模和它的区别
nicobailon/visual-explainer开源技能2026-02-1610,820★同样是"复杂内容 → HTML 页 / 幻灯片",但由模型手写整页 HTML,主打 diff review、计划审计;没有渲染 CLI,也没主打省 token
nexu-io/html-anything开源2026-05-119,428★Markdown → 公众号 / 小红书成品页,面向内容发布,不是回答问题
zarazhangrui/codebase-to-course、beautiful-html-templates开源2026-03 / 2026-055,770★ / 4,937★讲代码库的课程页、HTML 模板,场景更窄
plannotator/effective-html开源2026-06-093,964★呼应 Thariq "HTML 取代 Markdown",偏计划和规格文档
danyuchn/asd-ste100-skill开源技能2026-07-206,099★(gain_7d 291)只做 Karpathy 阶梯的第一级(STE100 写作),同样吃到了 10-02 的流量
ChangWenC/understanding-ladder开源2026-10-04121★同一条帖子的"阶梯"技能,自动选文字 / 图 / HTML / 视频分镜,没有渲染器
ashryaagr/karpathy-output-style开源2026-10-02(比它还早 2.5 小时)53★同一条帖子的输出风格,纯提示词
JAICHANGPARK/ASD-STE100开源2026-10-0224★同一条帖子,四种模态 + Mermaid,纯提示词
ajithraghavan 的 Karpathy 技能(dev.to、Show HN 10-06)开源2026-10-05未核实(小)同一条帖子,按需选格式;Show HN 没有起来
Claude.ai Artifacts、ChatGPT Canvas大厂功能2024大只在聊天网页里有;终端 agent(Claude Code / Codex)里没有原生的"回答成页"
Thariq Shihipar(Anthropic Claude Code 负责人)"HTML 取代 Markdown"做法思潮,不是产品2026-05Lenny、InfoQ 报道过由模型手写 HTML,慢、费 token,这正是它攻击的痛点

数据来源:我们的 github 库 repo_profile(2026-11-06)、GitHub API。

关键对比:Karpathy 帖子带出的 10 来个技能里,只有它破了千 star(之前就有的 danyuchn/asd-ste100-skill 除外)。同一个时机、同一批受众,结果差两个数量级,所以差异不在时机,在产品和包装。

四、增长手段(证据)

  1. 蹭 Karpathy 的帖子(确认):LINUX DO 帖里作者原话是"理念来自 Karpathy 大佬 10 月 2 号发布的最新 X";AlphaSignal 的报道也引用了 Karpathy。中文公众号文章标题直接写《大神 Karpathy 教过一招:让 AI「用 HTML 输出」…于是就有了开源 Skill《answer-me-with-html》》。
  2. GitHub Trending / Trendshift(确认):10-04 Trendshift 全语言第 8,之后 JS 榜断续上榜到 10-30。我们库记 trending_days_any=0,口径不同(trending 只收建库满约 60 天的库)。
  3. LINUX DO(确认):作者 10-05 发开源推广帖(账号 qingyun7z),3.1k 次浏览、242 个赞、67 楼回复;README 的 Community 一节专门致谢 LINUX DO(这是论坛开源推广的要求)。帖子到 10-30 还被顶上来。
  4. 技能目录站 / 聚合站自动收录(确认):skillsllm、skillsdirectory(评级 A)、skills.sh、typingmind、hotskills、skillstore、aiagents.org、frontiernow、iyooo、dshpacks、plugandship 等。安装方式 npx skills add(vercel-labs/skills,支持 70 多种 agent)本身就是一个分发入口。作者 11-03 一口气 fork 了 6 个 awesome-claude-skills / awesome-agent-skills 列表,意图明显是提 PR 上榜(fork 记录可见,PR 是否合入未核实)。
  5. AI 资讯站 / newsletter(确认):AlphaSignal(10-06)、Hermes AI News(10-06)、aiidelist(10-04)、CSDN gitblog 的组件教程(10-08)、掘金(10-14 改造文,11-06 又有《神级 Skill,让 AI 用 HTML 代替 Markdown 回复》)。
  6. 短视频 / 社媒转述(确认有,作者是谁未核实):YouTube Shorts Forkcast(第三方无脸 GitHub 推荐号,发布时约 2.7k★)、繁中的 Threads(@derekhsu)/ Instagram / Facebook / YouTube Shorts 图解、LinkedIn 转发。有的帖写着 "1.5K+ GitHub stars",说明是早期发的。
  7. Reddit / HN(弱):r/ClaudeCode 有贴《Does an "answer with HTML" skill actually save tokens? I tested it》(403,读不到内容);Show HN 10-14 只有 1 分,HN 没起量。
  8. X 上没找到大号转发的证据:x-radar 语料里搜不到这个仓库名,未核实。

五、为什么能跑出来

  1. 时机:Karpathy 10-02 的帖子给了一个现成的需求和词汇("让 LLM 用 HTML / 讲解视频回答你"),它在 9 小时内上线,吃到第一波搜索和讨论。前面还有 Thariq 5 月"HTML 是新的 Markdown"铺垫了半年,用户早就被教育过。
  2. 把 Karpathy 的四级阶梯一次做全:STE100 写作、图、HTML、3b1b 风格视频都有,而同期竞品大多只做一级。用户搜任何一个关键词都可能落到它。
  3. 真正的技术差异:"模型写 Markdown + 组件块(sequence / flow / ER…),CLI 50ms 渲染成离线单文件 HTML"。README 拿可复现的 benchmark 证明:输出 token 4,893→612,耗时 31s→12s。LINUX DO 网友的第一反应就是"输出 token 可比输入 token 值钱"。这是它和"让模型手写 HTML"那批技能(包括 10k★ 的 visual-explainer)最大的不同。
  4. 包装是一流的开源营销:README 首屏是"文字墙 vs 一页图"的对比图,加 24 秒带音乐的演示视频、中英双语 README、官网 answer-me-with-html.com、"让你的 agent 读 INSTALL.md 自己装"的一句话安装(专门写给 agent 读的安装文档)、Claude Code 插件市场 / DeepSeek Harness 插件 / npx skills 多入口。
  5. 高频迭代 + 社区反馈闭环:36 天合并 243 个 PR。LINUX DO 楼里网友提的 Tailscale 方案,作者当场做进了产品。持续修 flow 图交叉之类的细节,维持了口碑和二次传播(10-19、10-29、11-06 的小波峰)。

六、差异化

  • 核心差异是"内容和排版分离"的渲染管线:LLM 只出语义草稿,确定性的 CLI 负责布局、主题和 SVG 几何。由此带来快、省 token、页面稳定好看,离线单文件也能用。
  • 这是不是它跑出来的原因?是,而且是相对同期竞品的决定性原因。 时机(Karpathy)是所有同类共享的,唯独它把"又慢又贵"这个必然出现的反对意见提前用数据堵住了,再加上远超同类的 README / 视频包装。它比 visual-explainer 晚 8 个月,规模只有对方的一半左右,但 30 天增速远超对方(visual-explainer gain_7d 117,它是 681)。

七、能见度与跟风

  • 能见度:小圈子里在传。中文开发者圈(LINUX DO、掘金、CSDN、公众号)和 AI 技能目录 / newsletter 圈都已覆盖;AlphaSignal 报道过。没有看到 Karpathy 本人或 X 大号点名转发,也没进主流科技媒体。开源项目没有收入可言(只挂了 Ko-fi / 爱发电打赏)。
  • 跟风者:jerrywu001/ask-report-html(10-14 掘金发文,"基于 answer-me-with-html 改造",写完代码后出 HTML 报告);同一条 Karpathy 帖子带出的平行技能 understanding-ladder、karpathy-output-style、JAICHANGPARK/ASD-STE100、dualface/ste-zh(874★)、lemonhall/asd-ste100-skill-zh、mzopedia/simplified-technical-chinese。mzopedia 也是本仓库的贡献者。

八、可借鉴

  • 追大 V 帖子要快,还要"做全":当天把帖子里所有点子都实现成一个可安装的东西,并在 README 首行把帖子里的关键词全挂上(SEO 和 topics)。
  • 提前回答第一个反对意见,用可复现的 benchmark(token、耗时)而不是形容词。
  • "LLM 出结构化草稿 + 确定性渲染器"这个模式可以迁移:PPT、图表、海报、视频、报告,凡是"让模型直接写代码产物"又慢又不稳的地方都能用。
  • 分发组合:LINUX DO 开源推广帖(中文开发者冷启动最有效的一站)+ npx skills / 插件市场 + 目录站被动收录 + awesome 列表 PR + 中英双语 README 和演示视频。
  • 专门写给 agent 读的 INSTALL.md,"复制一句话让 agent 自己装",把安装摩擦降到零。

九、还不确定的

  • 10-03→10-04 那一天 +731 的直接来源:是 X 上某条转发、Karpathy 帖子下的回复,还是 GitHub 自身流量?x-radar 语料没收录,stargazers 接口被隐藏(404),没法按来源拆。
  • 繁中短视频 / Threads / Instagram 帖是作者本人的矩阵还是第三方,未核实。
  • 实际使用量:star 不等于安装;skills.sh 的安装数未取到。
  • 合入的 PR 有多少是 AI 代写、awesome 列表的 PR 是否合入,未核实。

出处

文章由 AI 根据公开数据和我们每天采集的数据写成,数字带出处,推断已标明