Rico MD - 公众号 Markdown 编辑器
一个面向微信公众号写作与排版的纯前端 Markdown 编辑器,支持实时预览、代码块主题、图片本地持久化与一键复制富文本。
在线地址
仓库地址:
核心能力
1. 编辑与预览
- 左侧 Markdown 编辑,右侧实时预览。
- 支持常用编辑快捷操作(标题、加粗、斜体、引用、代码块、分割线、表格等)。
- 支持桌面/手机预览模式切换。
2. 文档管理
- 支持多文档创建、切换、复制、删除、搜索。
- 删除操作使用确认弹窗,避免误删。
- 删除最后一篇文档后会自动创建一篇空白文档,保证始终有可编辑文档。
- 文档与当前激活状态会持久化到
localStorage。
3. 自动保存与保存状态
- 输入后采用固定
5 秒防抖自动保存。 - 状态栏显示
保存中 / 已保存 / 保存失败与最后保存时间。 - 保留显式保存快捷键:
Ctrl/Cmd + S。
4. 主题与代码面板
- 内置多套公众号排版主题(当前 20 套),按风格分类:
- 简约主义:默认、极简、科技、优雅简约、沉浸阅读、Jony Ive
- 技术阅读:Anthropic、Wired、Medium 阅读、Apple 极简、AI Coder
- 传统质感:纸纪、晚点深度、金融时报、墨线·报纸、杂志
- 设计灵感:素白·留白、赭红·编辑、素灰·清水、赤陶·有机、墨蓝·卫报、朱红·日经、素墨·世界报
- 代码面板支持独立代码主题(当前 16 套)。
5. 图片处理(本地优先)
- 支持粘贴、拖拽、工具栏上传图片。
- 使用 Canvas 压缩(保留 GIF/SVG 策略)后写入 IndexedDB。
- 编辑器内使用
img://短链接,避免大段 Base64 影响输入性能。 - 渲染时从 IndexedDB 读取并替换为可预览 URL。
- 复制到公众号时自动转换为 Base64,提升粘贴兼容性。
6. 导出与复制
- 一键复制到公众号(富文本 HTML)。
- 支持复制纯文本。
- 支持导出
.md与.html。