Search...Search plugins and themes...
⌘K
Sign in
  • Get started
  • Download
  • Pricing
  • Enterprise
  • Account
  • Obsidian
  • Overview
  • Sync
  • Publish
  • Canvas
  • Mobile
  • Web Clipper
  • CLI
  • Learn
  • Help
  • Developers
  • Changelog
  • About
  • Roadmap
  • Blog
  • Resources
  • System status
  • License overview
  • Terms of service
  • Privacy policy
  • Security
  • Community
  • Plugins
  • Join the community
  • Discord
  • Forum / 中文论坛
  • Merch store
  • Brand guidelines
Follow us
DiscordTwitterBlueskyThreadsMastodonYouTubeGitHub
© 2026 Obsidian

Mermaid Tools

dartungardartungar275k downloads

Improved Mermaid.js experience: visual toolbar with common elements and more.

Add to Obsidian
  • Overview
  • Scorecard
  • Updates15

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

Start ---> Stop

will render as:

image

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.

image

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
63%
HealthGood
ReviewRisks
About
Open a Mermaid toolbar and insert common Mermaid.js building blocks into the editor with one click. Create, edit, delete, and reorder custom elements to build reusable diagram snippets; elements are wrapped as complete diagrams for rendering.
DrawingVisualizationCode
Details
Current version
1.3.0
Last updated
9 months ago
Created
4 years ago
Updates
15 releases
Downloads
275k
Compatible with
Obsidian 1.4.0+
License
MIT
Report bugRequest featureReport plugin
Sponsor
PayPal
Author
dartungardartungar
dartungar.com
GitHubdartungar
  1. Community
  2. Plugins
  3. Drawing
  4. Mermaid Tools

Related plugins

D2

A modern diagram scripting language that turns text to diagrams.

Tldraw

Integration with tldraw, allowing users to draw and edit content on a virtual whiteboard.

ABC Music Notation

Render music sheets directly from code blocks using ABC music notation via abcjs.

ProgressBar

Render CodeBlock into a progress bar based on time or manually.

Templater

Create and use dynamic templates.

Maps

Adds a map layout to bases so you can display notes as an interactive map view.

Advanced Canvas

Supercharge your canvas experience. Create presentations, flowcharts and more.

PlantUML

Generate PlantUML diagrams.

Strange New Worlds

Reveal networked thought and the strange new worlds created by your vault.

Charts

Easily create interactive charts in your notes.