Skip to content

Claude Code输出HTML替代Markdown:5大实用场景+Karpathy/Thariq观点

2026年5月17日

MD 已死,HTML 当立!Anthropic Claude Code 工程负责人 Thariq 发文:HTML 碾压 Markdown。Karpathy:方法是真的好用。

背景

Anthropic Claude Code 工程负责人 Thariq 发了一篇长文,X 上获得超 1500 万阅读:

「用 Claude Code 做事,HTML 好用得离谱。」

他说自己现在做规划、写报告、代码审查,全都让 Claude Code 输出 HTML。Markdown?基本不碰了。

Karpathy 卡神也评论:这方法是真的好用。

核心观点

观点说明
Markdown为人手写设计
HTML为机器生成设计
AI 时代Markdown 手写优势消失

当写文件的不再是你而是 AI 的时候,Markdown 那套方便手写的优势就不存在了。

HTML 的三个碾压点

碾压点一:信息量天差地别

格式能力
Markdown标题、加粗、列表、代码块
HTML表格、CSS样式、SVG图表、折叠面板、标签页切换

Claude 在 Markdown 里画流程图只能用 ASCII 码拼——像逼画家用筷子画油画。

同样 200 行的技术方案:

  • Markdown 版:瞟一眼就关了
  • HTML 版:就能认真读完

碾压点二:分享成本为零

格式分享方式
Markdown对方得找能渲染的工具打开
HTML浏览器直接打开,甩个链接就行

你的方案被老板真正读到的概率,直接翻倍。

碾压点三:可以交互

功能示例
滑块参数调整
按钮触发操作
拖拽自由操作
完整工具Prompt 编辑器(左边改,右边预览)

5 大实用场景

场景一:技术方案对比

场景说明
以前Claude 给一堆 Markdown 文字,看得眼花
现在HTML 左右分栏,两种方案对比,优缺点一目了然

关键:不用在脑子里做对比,视觉上就直接对比了。

场景二:代码审查报告

元素HTML 支持
Diff 高亮
折叠面板✅ 展开看详情
标签页✅ 切换文件
跳转链接✅ 点击跳转到行号

场景三:架构图 + 流程图

元素MarkdownHTML
流程图ASCII 拼凑SVG 矢量图
架构图文字描述图形化展示
时序图文本箭头动态时序图

场景四:数据报告 + 图表

元素MarkdownHTML
表格基础表格高级表格(排序、筛选)
图表ECharts / Chart.js
交互点击查看详情

场景五:交互式文档

功能说明
折叠面板收起展开
标签页切换不同内容
锚点跳转点击跳转
搜索Ctrl+F 全文搜索

Thariq 的 HTML 输出技巧

让 Claude 直接输出 HTML

把方案用 HTML 格式输出,不要 Markdown。

指定样式

用简洁现代的 CSS 样式,响应式设计,表格清晰。

加交互元素

加上可折叠的详情面板、可切换的标签页。

自动刷新预览

生成一个可实时预览的配置工具。

HTML 的局限性

局限说明
手写困难不适合手动编写
复杂度高比 Markdown 复杂
学习成本需要了解基本语法

结论:不是替代 Markdown,而是 AI 时代的新选择。

什么时候用 HTML

场景推荐格式
AI 生成方案✅ HTML
手动写笔记Markdown
快速临时记录Markdown
正式技术文档✅ HTML
分享给非技术人员✅ HTML
程序员内部文档视情况

Prompt 模板

markdown
帮我分析这个技术方案,用 HTML 格式输出,包含:
1. 概要部分(加粗标题 + 摘要)
2. 优缺点对比表(用表格展示)
3. 详细分析(可折叠面板)
4. 代码示例(语法高亮)
5. 结论建议(高亮显示)

样式要求:简洁现代,响应式,表格清晰。

资源推荐

资源说明
Thariq 原文X 上的长文
html-ppt-skillClaude Code 的 HTML 输出技能
Tailwind CSS快速美化 HTML

一句话总结

HTML 替代 Markdown = AI 时代文档输出的新范式。

三个碾压点:信息量更大、分享零成本、可交互。

适合场景:技术方案对比、代码审查报告、架构图、数据报告、交互式文档。

核心思维:Markdown 是给人手写的,HTML 是给机器生成的。当 AI 写文档的时候,用 HTML。

不要孤军奋战啦!

加入微信群一起学习交流 AI

与大神一起使用 OpenClaw、Hermes、Claude Code、Seedance 2.0、GPT-Image-2 等

微信公众号

扫码关注微信公众号
私信 "加群",将自动获取微信群二维码

探索 AI 世界,掌握智能未来