Obsidian Stats logoObsidian Stats

Auto Beautiful Mermaid

by rxdxxxx
5
4
3
2
1
Score: 50/100
Install Code

Description

An Obsidian plugin that intelligently routes Mermaid diagram rendering

Reviews

No reviews yet.

Stats

0
stars
511
downloads
0
forks
37
days
37
days
37
days
0
total PRs
0
open PRs
0
closed PRs
0
merged PRs
0
total issues
0
open issues
0
closed issues
23
commits

Latest Version

1.0.3
a month ago

Changelog

See all version on GitHub

README file from

Github

Auto Beautiful Mermaid

English | 中文

An Obsidian plugin that intelligently routes Mermaid diagram rendering:

  • beautiful-mermaid renders the 6 diagram types it supports (flowchart, sequence, state, class, ER, XY chart) — giving you polished, theme-aware SVG output.
  • Obsidian's built-in mermaid engine handles everything else (gantt, pie, mindmap, timeline, gitGraph, …) — preserving native interactivity and the full Mermaid type catalog.

Both Reading View and Live Preview are covered.

Features

  • ✅ Beautiful output for supported diagram types via beautiful-mermaid
  • ✅ Full Mermaid type coverage — no diagram ever falls through to an error box
  • ✅ Per-block toolbar: switch between Beautiful / System / Both / Source modes
  • ✅ Automatic dark/light theme adaptation
  • ✅ Live Preview support (CodeMirror EditorExtension)
  • ✅ Zero conflicts — completely takes over all mermaid fences so no duplicate rendering

Supported Diagram Types (Beautiful mode)

Type Keyword
Flowchart flowchart / graph
Sequence sequenceDiagram
State stateDiagram / stateDiagram-v2
Class classDiagram
ER erDiagram
XY Chart xychart-beta

All other Mermaid types default to System mode (Obsidian's built-in engine).

Installation

Community Plugin Store (recommended)

  1. Open Obsidian Settings → Community Plugins → Browse
  2. Search for Auto Beautiful Mermaid
  3. Click Install, then Enable

Manual

  1. Download main.js, manifest.json, styles.css from the latest release
  2. Copy them to <vault>/.obsidian/plugins/auto-beautiful-mermaid/
  3. Reload Obsidian and enable the plugin in Settings → Community Plugins

Compatibility

  • Minimum Obsidian version: 1.4.0
  • Conflicts with beautiful-mermaid-renderer — disable that plugin if both are installed

Development

npm install
npm run dev      # watch mode
npm run build    # production build
npm run test     # unit tests

See DEVELOPMENT.md for architecture details and the double-render root cause analysis.

License

MIT

Sponsors