一个简洁优雅的 Markdown 转换工具,支持将 Markdown 内容转换为 Word、PDF、HTML 等多种格式,并提供丰富的模板样式。
- 实时预览 - 输入 Markdown 内容即时渲染预览
- 多格式导出 - 支持导出 Word (.docx)、PDF、HTML 文件
- 富文本复制 - 一键复制渲染后的富文本到剪贴板
- 模板系统 - 内置多种精美模板,支持自定义样式配置
- 数学公式 - 支持 LaTeX 数学公式渲染 (KaTeX)
- 代码高亮 - 支持多种编程语言语法高亮 (Prism.js)
- 历史记录 - 自动保存编辑历史,方便快速恢复
- 本地存储 - 模板选择和配置自动保存,下次打开自动恢复
dmd/
├── index.html # 主页面
├── static/
│ ├── index.js # 主程序逻辑 (Vue 3)
│ ├── index.css # 样式文件
│ ├── utils.js # 工具函数
│ ├── tpl.js # 模板配置数组
│ └── lib/
│ └── html-docx.min.js # HTML 转 Word 库
└── README.md
| 模板名称 | 分类 | 说明 |
|---|---|---|
| 默认模板 | 极简 | 简洁清爽的默认样式 |
| 商务蓝 | 商务 | 适合商务报告文档 |
| 学术风格 | 学术 | 严谨规范的学术论文样式 |
| 清新绿 | 极简 | 自然清新的绿色主题 |
| 科技灰 | 商务 | 现代科技感灰色主题 |
| 温暖橙 | 商务 | 温暖活力的橙色主题 |
| 优雅紫 | 学术 | 优雅高贵的紫色主题 |
| 简约黑白 | 极简 | 极简主义黑白风格 |
| 深蓝海洋 | 商务 | 深邃稳重的蓝色主题 |
- 直接用浏览器打开
index.html文件 - 在左侧输入框中输入 Markdown 内容
- 点击「选择模板」选择喜欢的样式
- 点击「编辑模板」自定义颜色、字体、大小等
- 点击导出按钮选择需要的格式
每个模板包含以下可配置项:
{
colors: {
title: '#1a1a1a', // 标题颜色
text: '#333333', // 正文颜色
link: '#0066cc', // 链接颜色
codeBg: '#f5f5f5', // 代码背景色
quoteColor: '#666666', // 引用文字颜色
quoteBorder: '#dddddd' // 引用边框颜色
},
fonts: {
title: "'Microsoft YaHei', sans-serif", // 标题字体
text: "'Microsoft YaHei', sans-serif", // 正文字体
code: "'Consolas', 'Monaco', monospace" // 代码字体
},
sizes: {
h1: 22, // 一级标题字号 (pt)
h2: 16, // 二级标题字号 (pt)
h3: 14, // 三级标题字号 (pt)
text: 12 // 正文字号 (pt)
},
spacing: {
lineHeight: 1.8, // 行高
paragraphMargin: 16 // 段落间距 (px)
}
}在 static/tpl.js 文件中添加新的模板对象即可扩展:
var templates = [
{
id: 10, // 唯一ID
name: '我的模板',
category: '自定义',
preview: '# 预览文字',
config: {
// 配置项...
}
},
// ... 其他模板
];- Vue 3 - 渐进式 JavaScript 框架 (选项式 API)
- Element Plus - Vue 3 UI 组件库
- marked - Markdown 解析器
- KaTeX - 数学公式渲染
- Prism.js - 代码语法高亮
- html-docx-js - HTML 转 Word 文档
MIT License

