murm

A beautiful local mermaid diagram viewer with export & share capabilities

Features

✨ Live Preview - See your diagrams render as you type 🎨 Clean UI - Minimal, distraction-free interface 📊 Zoom & Pan - SVG-based zooming keeps diagrams crisp 📁 Multiple Diagrams - Create and manage multiple diagrams 💾 Auto-save - Your diagrams are saved to localStorage 🔗 Share - Generate shareable URLs with compressed diagrams 📤 Export - Download as PNG or SVG ⌨️ Keyboard Shortcuts - Power-user friendly

Quick Start

Run without installing

npx murm

Install globally

npm install -g murm
murm

Then open http://localhost:3000 in your browser!

Keyboard Shortcuts

• Ctrl/Cmd + D - Toggle diagrams sidebar
• Ctrl/Cmd + M - Toggle export/share menu
• Ctrl/Cmd + E - Export PNG
• Ctrl/Cmd + Shift + S - Share URL
• Ctrl/Cmd + 0 - Reset zoom
• Ctrl/Cmd + = - Zoom in
• Ctrl/Cmd + - - Zoom out
• F - Toggle fullscreen
• Esc - Close menus

Usage

1. Paste your mermaid code in the left panel
2. Watch it render in real-time on the right
3. Zoom, pan, and export as needed

Example

graph TD
    A[Start] --> B{Is it awesome?}
    B -->|Yes| C[Use it!]
    B -->|No| D[Use it anyway!]
    C --> E[Success]
    D --> E

Development

# Clone the repo
git clone https://github.com/yourusername/murm.git
cd murm

# Run locally
npm start

Publishing

# Build and test
npm test

# Publish to npm
npm publish

License

MIT