编辑、预览、HTML 同步看
左侧写 Markdown，右侧直接看渲染效果，并能顺手复制 HTML 输出。
适合文档和提示词草稿
常用于写 README、知识库、SOP、项目说明、提示词文档和内容草稿。
本地处理不上传内容
输入文本和预览结果都只在当前浏览器处理，不会上传到服务器。
浏览器本地处理
写 Markdown 时直接看预览和 HTML
适合写知识库、README、提示词文档、文章草稿和运营说明。输入内容只在当前浏览器内处理，不会上传服务器。
预览结果
18 行27 词210 字符
Token导航 Markdown 预览
这是一个 本地预览 示例，适合先写再看效果。
可以直接测试的内容
- 标题层级
- 列表和段落
- 链接
- CODETOKEN0
这一段会作为引用块显示。
const slug = "markdown-editor-preview";
console.log(slug);HTML 输出
已填入示例 Markdown，可直接边写边预览。
工具使用说明
Markdown编辑预览怎么用
输入 Markdown 文本
把说明文档、笔记草稿、提示词或 README 内容贴到编辑区。
边写边看预览
页面会同步渲染标题、列表、引用、链接和代码块等常见结构。
复制 HTML 或继续改稿
确认预览无误后，可直接复制 HTML 结果，或继续在本地改稿。
功能说明
这个工具解决什么问题
Markdown编辑预览工具适合什么场景
如果你经常写 README、产品说明、知识库条目、运营文档或提示词草稿，最常见的痛点就是写完还要切到别处看渲染结果。
这个页面把编辑区、预览区和 HTML 输出放在一起，适合一边写一边校对结构。
为什么还要保留 HTML 输出
很多内容最后不是直接存 Markdown，而是要贴进 CMS、邮件模板、低代码后台或别的富文本系统。
直接拿到 HTML，可以减少再找转换工具的来回切换。
使用时要注意什么
当前工具优先覆盖标题、段落、列表、引用、链接和代码块这些高频结构，适合大多数日常文档草稿场景。
如果你要完全复刻某个静态站生成器的语法扩展，最终仍建议以目标系统实际渲染结果为准。
常见问题
关于 Markdown编辑预览，用户常问这些
支持哪些 Markdown 结构？
当前优先支持标题、段落、列表、引用、链接、行内代码、代码块和分隔线等常见结构。
能直接复制 HTML 吗？
可以。页面会生成对应 HTML，并支持一键复制。
页面会上传我的文档草稿吗？
不会。Markdown 解析和预览都在浏览器本地完成。
适合写提示词文档吗？
适合。尤其是多段说明、步骤文档、知识库条目和 README 草稿。
和 Markdown转HTML 有什么区别？
这个工具更偏编辑和预览一体，适合边写边看；单纯转换则更适合已有内容直接批量转出。