Markdown 预览器
在左侧输入内容,右侧即可实时查看 HTML 渲染效果。本预览器采用 GitHub 风格 Markdown:支持表格、任务列表、带语法高亮的围栏代码块、删除线、自动链接的 URL 以及内嵌 HTML。它非常适合在提交前起草 README、检查评论在 PR 上的显示效果,或通过实时观察每次按键的渲染结果来学习 Markdown 语法。
如何使用预览器
-
1
编写 Markdown
在左侧窗格输入原始 Markdown,每次修改都会立即重新渲染右侧窗格。
-
2
查看 HTML 预览
右侧窗格以 GitHub 风格显示渲染后的结果。
-
3
切换模式
左右并排、仅预览或仅源码,让写作更专注、不受干扰。
-
4
复制 HTML
获取渲染后的 HTML,粘贴到邮件客户端或内容管理系统(CMS)中。
本预览器支持的功能
- **CommonMark:**标题、段落、强调、列表、引用块、代码块、链接、图片以及水平分割线。
- **GFM 扩展:**支持列对齐的表格、任务列表(
- [ ]和- [x])、使用~~的删除线、自动链接的 URL,以及带语言提示的围栏代码块。 - **语法高亮:**通过 highlight.js 支持 100 多种语言,JavaScript、Python、Go、Rust、SQL、YAML 等。
- **原始 HTML:**内嵌 HTML 会直接传递(出于安全考虑会进行净化处理)。
- **数学公式(可选):**启用数学扩展后,可渲染
$...$行内公式和$$...$$块级公式。
不支持的功能
- Obsidian 风格的自定义 wiki 链接(
[[Page]]),仅 Obsidian 支持。 - Pandoc 围栏 div(
:::),仅 Pandoc 支持。 - 服务器端包含或
{% ... %}模板标签。
常见用途
- **起草 README:**在 IDE 之外撰写,再粘贴最终版本。
- **检查 PR 评论格式:**发布前先行确认,GitHub 的评论框无法正确预览代码围栏。
- **将笔记转换为 HTML:**当你需要把带样式的内容粘贴到邮件或支持原始 HTML 的 CMS 时。
- **教学 Markdown:**左右并排显示让语法结构一目了然。
性能
渲染使用带 GFM 插件的 Markdown-it 解析器,完全在浏览器中运行。几百 KB 的文档可在毫秒级完成渲染;而超大文件(把整本书放在单个文件里)在输入时可能出现卡顿,遇到这种情况,请将其拆分为章节。
导出
- 复制 HTML 可获得包含渲染内容和样式类的
<div>。 - 下载 .md 可保存源文件。
- 通过浏览器的打印对话框选择打印为 PDF,即可生成带样式的渲染视图 PDF 副本。
常见问题
GitHub 在 GFM 的基础上叠加了自己的 CSS。HTML 输出应当一致,样式(字体、间距)则是它们自己的。若要完全一致,请使用“在 GitHub 上渲染“的主题切换选项。
支持,只要启用数学扩展,行内 $...$ 和块级 $$...$$ 就会通过 KaTeX 渲染。为了减小页面体积,该功能默认关闭。
会进行净化,<div>、<span>、<table>、<img> 等安全标签可以通过,而 <script> 和内联事件处理程序会被移除。
数百 KB 的文档都能流畅运行。对于超大文件,请关闭实时渲染,改为按需渲染。
渲染完全在客户端完成,内容不会发送到任何地方。如果刷新页面,除非浏览器保留了表单状态,否则草稿会丢失。
相关工具
ASCII 表参考
完整 ASCII 表,覆盖 0 到 127;列出每个代码的十进制、十六进制、八进制、二进制值和 HTML 数字字符引用写法,包括 NUL、LF、DEL。
HTML 字符参考
可搜索的 HTML 实体列表,含命名代码与数值代码,并支持一键复制特殊字符和符号。
键盘快捷键参考
搜索 macOS、Windows 和 Linux 上 VS Code、Chrome 以及使用 GNU Readline 的 Bash 的文档默认快捷键。
邮箱验证器
验证邮箱地址:RFC 5322 语法检查、实时 MX 记录查询,并显示本地部分、域名和长度详情。不会发送任何邮件。
编辑器配置生成器
根据你的缩进样式与大小、行尾、字符集和空格规则生成 .editorconfig 文件,让不同集成开发环境(IDE)和编辑器的格式保持一致。
证书解码器
粘贴一张 X.509 PEM 证书,并查看解码后的字段:主体、颁发者、序列号、签名算法、有效期及主体备用名称(SAN)。
此工具还提供其他语言版本
- Pratinjau Markdown [ID]
- Markdownプレビュー [JA]
- ตัวแสดงตัวอย่าง Markdown [TH]
- Trình xem trước Markdown [VI]
- Markdown-Vorschau [DE]
- Markdown 미리보기 [KO]
- Podgląd Markdown [PL]
- Visualizador de Markdown [PT]
- Previsualizador de Markdown [ES]
- Markdown-förhandsvisare [SV]
- معاينة Markdown [AR]
- Aperçu Markdown [FR]
- Markdown-preview [NL]
- Предпросмотр Markdown [RU]
- Markdown Önizleme [TR]
- Markdown Previewer [EN]
- Visualizzatore Markdown [IT]