夜雨聆风之前写了一篇介绍 OpenDesign 的文章之后，很多读者问：设计师用 AI 生成设计稿，程序员怎么快速把内容变成可交付的 HTML？
今天介绍的工具叫html-anything，来自同一个团队（他们的 open-design 项目 GitHub 40k Star）。核心理念很直接：
Markdown 是写作者的中间态，HTML 才是面向读者的最终产物。
你只需要提供内容，选一个模板，本地 AI 编码代理会自动生成可直接交付的单文件 HTML。
为什么值得看
1. 零 API 成本，复用你已有的 AI 工具
启动时会自动扫描本地环境，识别你已安装的 AI 编码 CLI：
Claude Code Cursor Agent Gemini CLI GitHub Copilot CLI Qwen Coder Aider
直接复用你已有的登录态，不需要额外配置 API Key，不需要支付任何费用。
2. 75 个预置技能模板，覆盖 9 种交付场景
每个技能都是独立文件夹，自带示例预览，无需配置：
所有技能内置反 AI 垃圾内容硬约束：CJK 优先字体栈、8px 基线网格、色彩对比度 ≥4.5、禁止占位文本。生成质量有保障。
3. 实时流式渲染，可中途打断
生成过程类似看 AI 实时打字，效果不满意随时按停，不用等完整生成。
4. 一键导出多平台
生成完成直接导出，格式自动适配：
- 微信公众号
：CSS 内联，粘贴到公众号编辑器格式完全保留 - X/Twitter、微博、小红书
：2 倍高 DPI PNG，截图直接粘贴发布 - 知乎
：LaTeX 公式自动转图片占位符 - 通用
：下载单文件 HTML（所有资源内联，浏览器直接打开）
怎么用
前置准备
本地提前安装好你使用的 AI 编码 CLI，并完成登录（Claude Code 执行claude login）。
启动命令
git clone https://github.com/nexu-io/html-anythingcd html-anythingpnpm installpnpm -F @html-anything/next dev
启动后打开 http://localhost:3000 即可使用。
使用流程
顶部栏自动识别本地已登录的 AI 代理，随时切换 左侧编辑器粘贴你的内容（支持 Markdown、CSV、JSON、纯文本） 中间面板选择技能模板，可搜索、按场景筛选 按 ⌘+Enter启动生成，预览窗口实时显示效果点击导出按钮，选择目标格式
技术细节
项目采用 pnpm workspace 管理，技术栈：
前端：Next.js 16 + React 19 + Tailwind v4 状态管理：zustand 导出：juice（CSS 内联）、modern-screenshot（PNG 导出） 安全：iframe 沙箱隔离，dompurify XSS 防护
项目已获得3.1k Star，核心功能稳定可用，后续会持续迭代。
*如果有以下报错提示，删除掉pnpm-workspace.yaml即可：
The local project doesn't define a 'packageManager' field.适合谁用
- 程序员/开发者
：快速生成技术文档、产品介绍 - 自媒体创作者
：一键导出适配多平台 - 设计师
：用 AI 生成 HTML 原型，节省手写代码时间 - 上班族
：周报、月报、数据报告快速生成
最后
写完 Markdown 直接出 HTML，不用再折腾 CSS 和排版。本地运行，数据安全无泄露风险。
项目地址：https://github.com/nexu-io/html-anything
感兴趣的去试试，有问题可以在评论区聊聊。