Markdown 在线预览

Markdown 在线预览：在输入时将 GitHub 风格 Markdown 实时渲染为整洁的 HTML，并可复制或下载。

你的 Markdown 在浏览器中本地渲染，不会上传到任何服务器。

由 Udit Agarwal 开发和维护

Markdown Syntax, Explained

在处理 MDX 文档？试试 MDX 转换器。

关于 Markdown 预览

这款 Markdown 预览工具会在你输入时并排将 Markdown 渲染为整洁的 HTML，让你准确看到 README、文档或评论的呈现效果。它支持 GitHub 风格 Markdown（GFM），包括表格、围栏代码块、任务式列表、引用块、链接和行内格式。可将它当作快捷的 Markdown 编辑器和 Markdown 查看器来撰写文档、在推送到仓库前检查格式，或将 Markdown 转为 HTML 并复制到 CMS 中。默认情况下，单个换行会变成换行符；打开 GitHub style 开关后，它会像在 README 中一样变成空格。script、iframe 等标签、事件属性和 javascript: 链接会被移除，但这只是基础过滤，并非完整的净化。它专为需要快速、准确 GFM 预览的开发者、技术文档撰写者和 QA 打造。所有处理都在你的浏览器本地完成，因此你的草稿不会离开你的设备。

功能特性

• 并排实时预览，随输入即时更新
• 支持带表格、围栏代码块和任务列表的 GitHub 风格 Markdown
• 支持标题、列表、引用块、链接和行内强调
• 默认把单个换行渲染为换行符；GitHub style 会像 README 一样把它们变成空格
• 移除 script、style、iframe、object、embed、link、meta 和 base 标签、事件属性以及 javascript: 链接
• 一键将渲染后的 HTML 复制到剪贴板
• 将结果下载为可直接使用的 .html 文件
• 完全在你的浏览器中运行

如何使用 Markdown 预览

1. 在左侧输入框中输入或粘贴你的 Markdown。
2. 在预览面板中即时查看渲染后的 HTML。
3. 点击复制 HTML，将渲染后的标记复制到剪贴板。
4. 使用 .html 按钮将输出下载为文件，或点击清除重新开始。

示例

输入

# Title

- **Bold** item
- [Link](https://example.com)

输出

<h1>Title</h1>
<ul>
<li><strong>Bold</strong> item</li>
<li><a href="https://example.com">Link</a></li>
</ul>

Markdown 的标题、列表和行内格式渲染为 HTML。

常见错误与故障排除

• 表格无法渲染，显示为纯文本。 — GFM 表格需要一个标题行和一条由短横线与竖线组成的分隔行，例如 | A | B | 后跟 | --- | --- |。请确保每一行的竖线数量匹配。
• 代码块的格式渗入了文档的其余部分。 — 请用匹配的三反引号行关闭每个围栏代码块。未关闭的围栏会让渲染器把其余文本都当作代码。
• 单个换行没有按预期保留。 — 默认情况下，单个换行会变成换行符。打开 GitHub style 可把它当作空格处理，就像 GitHub 显示 README 那样；想要分隔段落时，请在文本块之间留一个空行。
• 像 script 或 iframe 这样的原始 HTML 标签从预览中消失了。 — script、style、iframe、object、embed、link、meta 和 base 标签以及 on* 事件属性会被刻意移除。请改用纯 Markdown 或简单的行内 HTML。

常见问题

什么是 ArrayKit Markdown 预览工具？

它是一个实时 Markdown 预览工具，会在你输入时并排将 Markdown 渲染为整洁的 HTML，让你在发布前检查 README、文档和评论的格式。

Markdown 预览支持 GitHub 风格 Markdown 吗？

支持。Markdown 预览会渲染 GFM，因此表格、围栏代码块和任务式列表都能在预览面板中正确显示。

如何复制或下载渲染后的 HTML？

点击复制 HTML 将渲染后的标记发送到剪贴板，或使用 .html 按钮将其下载为可直接使用的文件。

Markdown 预览会从 HTML 中移除什么？

script、style、iframe、object、embed、link、meta 和 base 标签，onclick 这类 on* 事件属性，以及以 javascript: 开头的链接。这只是基础过滤，并非完整的净化；如果 Markdown 来自你不信任的来源，发布前请先用专门的净化工具处理 HTML。

Markdown 预览会保留单个换行吗？

默认会：单个换行会变成换行符，就像评论和聊天中那样。打开 GitHub style 后，单个换行会变成空格，就像 GitHub 显示 README 那样。

使用此预览时，我的 Markdown 会被发送到服务器吗？

不会。你的 Markdown 完全在你的浏览器中渲染，绝不会离开你的设备。

相关工具

• MDX 转换工具 — 将 MDX 渲染为文本、将 HTML → MDX，并将文本转义为 MDX 字面量。
• HTML 格式化工具 — 美化或压缩 HTML，格式化内联 CSS/JS 并预览结果。
• HTML 转义 / 反转义 — 转义和反转义 HTML 特殊字符与实体。
• 文本对比 — 逐行对比两段文本，查看新增和删除内容。
• PDF 转文本 — 将 PDF 中可选取的文本提取为纯文本或 Markdown。
• Mermaid 图表渲染器 — 在浏览器中将 Mermaid 图表（流程图、时序图、甘特图）渲染为 SVG。
• JSON 格式化工具 — 美化、压缩并验证 JSON，并定位错误位置。
• CSS / SCSS 格式化工具 — 美化或压缩 CSS/SCSS/LESS，排序属性并去除重复项。

更多代码格式化工具

• 正则测试工具 — 实时测试正则表达式，显示匹配项、分组和标志。
• CSS 颜色转换工具 — 在 HEX、RGB 和 HSL 之间转换，并实时显示色样。
• 文本对比 — 逐行对比两段文本，查看新增和删除内容。
• MDX 转换工具 — 将 MDX 渲染为文本、将 HTML → MDX，并将文本转义为 MDX 字面量。
• CSS / SCSS 格式化工具 — 美化或压缩 CSS/SCSS/LESS，排序属性并去除重复项。
• JS / TS 格式化工具 — 使用 Prettier 选项美化 JavaScript、TypeScript 和 JSX/TSX，或压缩纯 JavaScript。
• HTML 格式化工具 — 美化或压缩 HTML，格式化内联 CSS/JS 并预览结果。
• XML 格式化工具 — 美化、压缩和验证 XML，并在 XML ↔ JSON 之间转换。
• SQL 格式化工具 — 为 MySQL、PostgreSQL、SQL Server、SQLite、BigQuery 和 Oracle 格式化 SQL。
• GraphQL 格式化工具 — 格式化或压缩 GraphQL 查询和模式，验证语法并提取操作。
• Dockerfile 格式化工具 — 格式化 Dockerfile 并获取最佳实践和 lint 建议。
• MongoDB 查询格式化工具 — 格式化 MongoDB shell 查询和聚合管道。

查看全部代码格式化工具 (32) · 全部工具