Adding that I would love this upgrade. Ideally to latest at v11.1.0 which also adds architecture as a diagram type.
I think in general a planned cadence of upgrading Mermaid would be good (every 3 months or something like that?), so that Obsidian keeps up to date with latest features. Mermaid seems to be doing upgrades at a good pace, and it would be nice if we could know that Obsidian will be current withing X amount of time.
I am looking forward to being able to control the layout with block diagrams!
I would love to get access to architecture diagrams. I have started using them elsewhere and being able to start integrating them into my personal documentation
I would love if the new version would be v11.0.0 or newer, since that adds Packet Diagrams which is just perfect for my every day work. I hope a new mermaid version is in scope sometime in the near future <3
Bumping this, my mermaid chart fails to render on Obsidian, but it works on the official mermaid live editor.
I would suggest sharing the code, or the specific feature that isn’t working for you. While you wait for an upgrade, someone might have a suggested workaround, or spot a syntax problem.
Or if it seems like something really important, maybe upgrading will get higher priority. Either way, I suggest giving more info about your problem.
Sure.
OS: Fedora Linux 40
Obsidian version: v1.6.7 (Flatpak)
Only one community plugin installed (Self-hosted LiveSync)
Code (Uncomment the last two lines to reproduce):
```mermaid
flowchart TB
user{External user}
subgraph sitea[Site A]
subgraph sitearpi4b["Raspberry Pi 4B (Home Assistant OS)"]
siteaadguardhome[AdGuardHome]
siteachrony[Chrony]
siteatailscale((Tailscale))
end
subgraph siteads220["Synology DS220+ (DSM7)"]
siteahyperbackup["Hyper Backup"]
subgraph siteadebian["Debian (VM)"]
siteacups[CUPS]
siteascanservjs[Scanservjs]
end
end
subgraph siteamt6000["GL-iNET MT6000 (OpenWRT)"]
siteanginx[luci-ssl-nginx]
siteaacme[luci-app-acme]
siteawireguard[luci-proto-wireguard]
end
end
subgraph siteb[Site B]
subgraph sitebjonsbon2["Jonsbo N2 (TrueNAS Scale)"]
sitebdemocratic_csi[democratic-csi]
sitebtruenas_rsync[rsync]
sitebpbs["Proxmox Backup Server (VM)"]
sitebvault["Hashicorp Vault (Docker)"]
end
subgraph sitebformdt1["Formd T1 (Proxmox)"]
subgraph sitebdebian1["Debian (VM)"]
sitebwolf[games-on-whales]
end
subgraph sitebdebian2["Debian (VM)"]
sitebk8s_worker1["Kubernetes (Worker)"]
end
subgraph sitebdmz[DMZ]
subgraph sitebcentos1["CentOS Stream (VM)"]
sitebdmz_nginx[nginx]
sitebdmz_ddclient[ddclient]
sitebdmz_certbot[certbot]
sitebdmz_blog["Personal blog"]
end
subgraph sitebcentos2["CentOS Stream (VM)"]
sitebdmz_javaproj["Java project"]
end
end
end
subgraph sitebrpi4b1["Raspberry Pi 4B (Home Assistant OS)"]
sitebadguardhome[AdGuardHome]
sitebchrony[Chrony]
sitebtailscale((Tailscale))
end
subgraph sitebj4125["Cnction J4125 (OpenWRT)"]
sitebddns[luci-app-ddns]
sitebwireguard[luci-proto-wireguard]
sitebwol[luci-app-wol]
end
subgraph sitebwax220["Netgear WAX220 (OpenWRT)"]
sitebnginx[luci-ssl-nginx]
sitebacme[luci-app-acme]
end
subgraph sitebrpi4b2["Raspberry Pi 4B (PiKVM)"]
end
subgraph sitebrpi4zero2w["Raspberry Pi Zero 2 W (PiKVM)"]
end
subgraph sitebrpi5["Raspberry Pi 5 (Raspberry Pi OS)"]
sitebk8s_control_plane1["Kubernetes (Control Plane)"]
end
subgraph sitebn100["BKHD N100 (Proxmox)"]
subgraph sitebdebian3["Debian (VM)"]
sitebk8s_worker2["Kubernetes (Worker)"]
end
end
subgraph sitebk8s["Kubernetes Cluster"]
k8s_lavalink[Lavalink]
k8s_discordbot["Discord Bot"]
k8s_freshrss[FreshRSS]
k8s_couchdb[CouchDB]
k8s_dashy[Dashy]
k8s_postgres[Postgres]
k8s_fireflyiii["Firefly III"]
subgraph sitebhelm["Helm charts"]
sitebk8s_kube_prometheus_stack{{kube-prometheus-stack}}
sitebk8s_external_secrets{{external-secrets}}
sitebk8s_argocd{{argo-cd}}
sitebk8s_cert_manager{{cert-manager}}
sitebk8s_metallb{{metallb}}
sitebk8s_ingress_nginx{{ingress-nginx}}
sitebk8s_external_dns{{external-dns}}
sitebk8s_cilium{{cilium}}
end
end
end
%% sitea connections
siteanginx --> siteads220
siteanginx --> sitearpi4b
%% siteb connections
sitebnginx --> sitebjonsbon2
sitebnginx --> sitebformdt1
sitebnginx --> sitebrpi4b1
sitebnginx --> sitebrpi4b2
sitebnginx --> sitebrpi4zero2w
sitebdmz_nginx --> sitebcentos2
sitebdmz_nginx --> sitebdmz_blog
sitebk8s_control_plane1 <--> sitebk8s
sitebk8s_worker2 <--> sitebk8s
sitebk8s --> sitebdemocratic_csi
sitebk8s_external_secrets --> sitebvault
%% Cross site connections
sitebtruenas_rsync <--> siteahyperbackup
sitebwireguard <--> siteawireguard
%% External user connection
user --(Wireguard)--> siteanginx
user --(Wireguard)--> sitebnginx
user --(Wireguard)--> sitebk8s_ingress_nginx
user --Tailscale--> siteatailscale
user --Tailscale--> sitebtailscale
%% These two lines crash mermaid in obsidian
%%user --> sitebdmz_nginx
%%sitebk8s_worker1 <--> sitebk8s
```
Now that mermaid.js supports an expanded catalogue of shapes out of the box it has become my go to, but it was introduced in v11.3.0 and whatever version is in obsidian atm, is too old. The feature I’m needing but Obsidian is unable to render is this one:
I’m on Obsidian v1.7.4 snap
Seconding this, I’m also really in need of this creating and deleting feature, without it my sequence diagrams end up with very wide graphics with lots of vertical lines for nodes that are used only twice
I want to draw flowchart with math in node value but it won’t render in Obsidian side. I don’t know when this feature is introduced to Mermaid, but I hope Obsidian would bump its Mermaid version that includes math! Pretty please 
I made a “theme” for Mermaid diagrams some time ago, which is independent of my main theme, called Dune (on the same GitHub page).
The default mermaid theme colors of my plugin should be enough for most people, but if you like, download and activate the community plugin style settings (by Mgmeyers), to be able to change colors of your mermaid theme. Here’s the link:
I made this mermaid theme mainly because from a developer view, you’ve to overwrite mermaid color rules with!important to force color changes and I didn’t want to see this rule in my main theme by default.
Usually, the !important rule is needed to overwrite not properly implemented code and this isn’t a critique, but I’m talking of experience.
At the end, I’m happy to share my mermaid theme as separate plugin, so you can use it also without installing my theme, if you are already happy with
another theme. If you’re looking for a new theme instead, feel free to try out my community theme, Dune. You’re welcome 
Looking forward to a better implementation (upgrade) of mermaid in Obsidian too.
I’m also got problem when using New Shapes in FlowCharts
Example:
A@{ shape: rect }