Markdown 在线预览编辑器

Name: Markdown 在线预览编辑器
Author: PTBox

Markdown 在线预览工具，左侧编辑、右侧实时渲染。基于 react-markdown + remark-gfm，支持 GitHub Flavored Markdown 全部语法（表格、任务列表、删除线、自动链接、围栏代码块），所有渲染在浏览器本地完成，内容不会上传。

同步滚动

Markdown 源码498 字符

预览

Markdown 预览

这是 H2 标题

支持加粗、斜体、~~删除线~~、行内代码 等基本语法。

列表

无序项目 1
无序项目 2
- 嵌套项
已完成的任务
未完成的任务

表格

工具	状态	备注
JSON 格式化	✓	支持宽松解析
Markdown 预览	✓	实时渲染
繁简转换	✓	OpenCC 词典

代码块

function hello() {
  console.log("Hello, PTBox!");
}

引用

Markdown 让写文档变得简单。

—— 任何一个写过 README 的程序员

链接 & 图片

PTBox 是一个程序员工具箱。

水平线

支持 GitHub Flavored Markdown，所有渲染在浏览器本地完成。

支持 GitHub Flavored Markdown（GFM）：表格、任务列表、删除线、自动链接等。原始 HTML 标签会被自动转义，防止 XSS。

使用说明

左侧编辑、右侧实时渲染。基于 react-markdown + remark-gfm，支持 GFM（表格、任务列表、删除线、自动链接、围栏代码块）。

原始 HTML 自动转义防 XSS。大文档用 useDeferredValue 异步渲染不卡输入。

典型使用场景

README 编辑预览

在推 GitHub 前先确认渲染效果。

博客文章撰写

左侧写、右侧实时看效果。

文档导出前预览

把 Markdown 内容贴进来，确认渲染没问题再转 PDF / HTML。

学习 Markdown 语法

实时看代码和效果对照，快速掌握表格、任务列表、代码块等。

常见问题

支持哪些扩展语法？

GitHub Flavored Markdown：表格、任务列表 [ ]、删除线 ~~、自动链接、围栏代码块。

能渲染数学公式 / 流程图吗？

暂不支持 KaTeX / Mermaid。后续考虑加。

原始 HTML 标签会被渲染吗？

不会。HTML 标签会被自动转义显示为文本，防止 XSS。

能导出 HTML 吗？

暂未提供一键导出。可在浏览器开发者工具里复制右侧渲染区的 HTML。