把 Pug 转成 HTML，先看效果再粘贴更稳妥
Pug（以及更早的 Jade）用缩进替代大量尖括号。写起来轻快，但当模板层级变深时，肉眼很难快速确认某个块到底是不是闭合正确。很多人会在本地装 Node 后跑 `pug` 命令行；这页把这一步直接搬到浏览器里。 你可以粘贴片段，或上传 `.pug` / `.jade` 文件，左侧改源码、右侧看 HTML。页面加载后转换在本机完成，不会把模板上传到服务器。和“贴进去就出结果”的单次转换器相比，这页更实用的点是可视化预览：从原始标记切到渲染视图，在复制到 CMS、邮件系统或团队项目之前先发现版式问题。
可视化转换，比在脑内推演缩进更高效
很多 Pug 转 HTML 工具只有文本框和下载按钮。处理五六行示例够用，但在检查导航结构、卡片网格、复杂页脚时就不够看。这里保持左右同屏：你改一层缩进，右侧 HTML 立即更新；要确认层级与间距时，切到“预览”看实际渲染，而不是只盯着 `</div>`。 输入区下方会实时提示语法状态。解析失败时，你能直接看到报错位置，而不是面对一个空白输出区域。实时 HTML + 沙箱渲染预览的组合，能显著减少“导出后再去别处打开才发现结构错了”的返工。
先讲清两个边界，避免浪费时间：本工具在浏览器内编译你当前粘贴/导入的 Pug，不读取项目目录，因此 `include`、`extends` 和外部 partial 不在支持范围。若模板是自包含的，mixin、条件、循环以及 `style.` / `script.` 这类块和本地编译体验一致。 另外，如果你在模板顶部写多行 JavaScript（比如菜单数组），请用单独一行 `-`，再把完整 JS 代码块缩进写在其下。Pug 只把 `-` 后第一行当作代码，直接换行续写数组常导致看起来莫名其妙的解析错误。
返回转换器先看渲染，再导出
预览标签会把编译后的 HTML 放进沙箱 iframe，标题、列表、链接都按浏览器真实效果显示。
左右对照改语法
左侧改 Pug，右侧看 HTML；属性名、类名、层级变化能即时确认。
临时转换也不用装环境
只为一个工单或临时模块生成 HTML 时，可直接跳过本地安装与脚本配置。
在线 Pug 转 HTML：不只转代码，更要核对页面结果
左右可视化编辑、编译后渲染预览、原始 HTML 输出与导出动作，一页完成且不上传源模板。
可视化结果可先验收，避免盲贴
布局刻意保持简单：左输入、右输出。你输入时 HTML 同步刷新；当你关心的是页面层次而不只是标签文本时，直接切到预览看导航、卡片、页脚是否落在正确结构。很多“语法上可编译、视觉上不对”的问题，都会在这一步暴露。 原始 HTML 也始终一键可见，便于检查属性、复制片段给 CMS 区块，或与已有文件做差异对比。不会被迫在“纯预览”与“纯代码”之间二选一。
如何在本页把 Pug 转成 HTML
添加 Pug 源码
在左侧粘贴，或上传 `.pug` / `.jade` 文件。缩进决定嵌套关系，文件内请保持空格/Tab 风格一致。若使用 `-` 写变量或数组，多行代码请放在单独 `-` 行下面的缩进代码块里。
查看 HTML 与预览
右侧默认显示渲染预览，可切换到 HTML 查看字面标签。若下方出现语法错误，请先修复；模板未解析通过时，预览与导出会被阻断。
复制、下载或继续在 Playground 编辑
目标是其他工具或 CMS 区块时可直接复制；需要文件交付就下载 `.html`。若还要可视化微调，点击“预览 / 可视化编辑 HTML”把结果发送到首页 Playground。
Pug 转 HTML 常见问题
准备好把 Pug 转成“看过效果”的 HTML 了吗？
左右同屏编辑、渲染预览、复制与下载，全程免费且无需账号。
Pug 转 HTML
- Pug 与 HTML 左右可视化对照
- 导出前先看编译后渲染效果
- 支持复制、下载或发送到 Playground
- 页面加载后在浏览器本地运行
仅支持自包含模板，不支持从磁盘读取 `include` / `extends`。
