hub / github.com/dartungar/obsidian-mermaid

github.com/dartungar/obsidian-mermaid @1.4.1

Chat with this repo

repository ↗ · DeepWiki ↗ · release 1.4.1 ↗ · + Follow

123 symbols 277 edges 44 files 0 documented · 0% ● updated 24d ago1.4.1 · 2026-05-18★ 3247 open issues

What it actually does AI analysis from the code graph — generated when you open this

loading…

README

Mermaid Tools for Obsidian.md

About Mermaid

Mermaid.js lets you create diagrams and visualizations using text:

Start ---> Stop

will render as:

Obsidian supports Mermaid.js natively, via mermaid codeblocks.

⚠️ Please note that rendering Mermaid is Obsidian's feature, and not implemented by this plugin. This plugin has no control over how Mermaid is rendered. All bugs concerning rendering of diagrams should be posted to official forums.

Mermaid Tools

This plugin adds a toolbar with common Mermaid.js elements, so you won't have to remember them.

Use ribbon icon or Mermaid: Open Toolbar View command to open the toolbar.

Click on an element to paste it into editor.

A small demo: obsidian-mermaid-demo-updated

Note: in toolbar panel, all elements are wrapped as complete diagrams for rendering purposes.

Create & Manage elements

You can create, delete, edit & reorder elements in settings tab: mermaid-toolbar-settings

Roadmap:

✅ add / edit elements in settings
✅ reorder elements in settings
UX improvements

Extension points exported contracts — how you extend this code

IMermaidElement (Interface)

(no doc) [1 implementers]

src/core/IMermaidElement.ts

SaveSettingsOptions (Interface)

(no doc)

main.ts

SettingsApi (Interface)

(no doc)

src/ui/toolbarView/mermaidToolbarView.ts

IElementCategory (Interface)

(no doc)

src/core/IElementCategory.ts

AppWithSettings (Interface)

(no doc)

src/ui/toolbarView/mermaidToolbarView.ts

IWrappingData (Interface)

(no doc)

src/core/IElementCategory.ts

MermaidRenderResult (Interface)

(no doc)

src/core/mermaidRenderer.ts

MermaidRenderer (Interface)

(no doc)

src/core/mermaidRenderer.ts

Core symbols most depended-on inside this repo

open

called by 8

src/ui/toolbarView/mermaidToolbarView.ts

src/ui/settingsTab.ts

getCategories

called by 5

src/core/categoryService.ts

createCategoryControlButton

called by 5

src/ui/settingsTab.ts

wrapForPastingIntoEditor

called by 4

src/core/elementService.ts

getInstance

called by 4

src/core/categoryService.ts

getCategoryById

called by 4

src/core/categoryService.ts

Shape

Method 55

Function 33

Class 26

Interface 8

Enum 1

Languages

TypeScript100%

Modules by API surface

src/ui/settingsTab.ts22 symbols

src/ui/toolbarView/mermaidToolbarView.ts14 symbols

src/core/categoryService.ts14 symbols

main.ts12 symbols

src/core/elementService.ts10 symbols

src/ui/toolbarView/viewHelpers.ts9 symbols

src/ui/editMermaidElementModal.ts8 symbols

src/ui/renderMermaidSvg.ts6 symbols

src/ui/editCategoryModal.ts6 symbols

src/core/textEditorService.ts6 symbols

src/ui/toolbarView/mermaidToolbarButtons.ts3 symbols

src/settings/settings.ts3 symbols

For agents

$ claude mcp add obsidian-mermaid \
  -- python -m otcore.mcp_server <graph>

⬇ download graph artifact

github.com/dartungar/obsidian-mermaid @1.4.1

Mermaid Tools for Obsidian.md

About Mermaid

Mermaid Tools

Create & Manage elements

Roadmap:

Extension points exported contracts — how you extend this code

Core symbols most depended-on inside this repo

Shape

Languages

Modules by API surface

For agents

Ask about this repo answers extend the page