I really love Mermaid Diagrams. This is one of the best libraries to come out. I'm writing a book, and being able to generate diagrams with mermaid and then customize the CSS to meet the guidelines from my editor has been fantastic. I've started including a lot more diagrams in my projects and documentation as well. It's just such a good tool.
I love Mermaid! I used to use that bitch all the time in college to make beautiful flowcharts and my friends would always ask me how I made them so nice looking. Another awesome thing about Mermaid is since it’s grounded in the HTML/CSS/JS web stack you can easily modify certain things in diagrams to do any custom tricks you need for your specific diagram. Aka Mermaid is hackable and I love software that is designed to give you that freedom.
ditto, GPT-4 is very impressive with all types of mermaid [0] diagrams! even helps w/ styling and formatting tweaks. It's helped me so much with better coverage and maintainability on diagrams for software & systems projects.
I definitely have made decent use of Mermaid diagrams in GitHub. But Mermaid diagrams are hard to layout, and there is only one experimental layout that's good for automatically generated diagrams. It's nice, but it's not quite there. I have tended to bounce between Mermaid and Visio.
I'm generally not a fan of exporting and importing diagrams constantly. One thing that is nice is that Confluence can support plugins for diagrams, which is okay-ish.
I used to generate most of my diagrams in PlantUML[0], but recently found that my not-taking app, Joplin[1], has Mermaid built in.
PlantUML has the benefit that you can include it in your builds, e.g. parse any .plantuml files in `make doc` or in your CI.
But I like Mermaid more: its easier to read, less quirky and easily integratable in the markdown (or note-taking apps) without the need for extra build steps.
I had just learned about Mermaid and used it standalone once, when I realized it is also already built into Github Markdown [0], where you can include a diagram by just going ```mermaid <code>```, which is veeery handy. In mermaid.live can also get an SVG URL which works great to paste into many online drawing tools like Miro, Diagrams.net etc.
The diagrams as code is not a one size fit all. I'd use mermaid for some technical things, but it's failing for communication/presentation purposes. You need to have the ability for arbitrary placement, annotations, flow. Mermaid is all fun until you want to connect two previously distant boxes and everything explodes - for long-term documentation purposes it may not even matter, but if I'm about to show it to anyone, I'm going to Excalidraw.
Thanks for mentioning mermaid.js. I am bookmarking this and excited to try it.
I’ve always loved https://sequencediagram.org for creating sequence diagrams with text (highly recommend btw), but have also wanted to create other diagram types in a similar manner. Mermaid.js looks super intriguing.
I really like using Mermaid to create state diagrams. I'd been looking for a tool like it for quite some time, and I think it slipped under my radar because it's more focused on sequence / flow diagrams and doesn't hype its state diagram capabilities as much. Using a text-based tool for this is so much better than my previous workflow of Visio or Powerpoint.
Mermaid is the fastest tool to write diagrams after pen and paper.
I use it with Markdown Enhanced, it's a powerful tool that quickly ensures your entire team is on the same page and understand the ideas/concepts you're discussing.
Started adding exported images in confluence with the source code attached to the same page, people always get amazed and started adopting it (slowly, I'd say).
The speed is great but not being attached to a heavy tool such as Visio or Gliffy is the game changer.
reply