Mermaid

In Beautifulhugo, the Hugo theme, mermaid.js, the library for drawing sequence diagrams, is already built in, so simply specifying the short tag and writing in the mermaid format is enough to display a sequence diagram. If it is not built into your theme, it is a good idea to refer to the article Hugoにmermaidを組み込んでみた (in Japanese). A simple sample graph LR A[Local] -->|git push| B(GitLab.com) B --> C{Netlify} Gantt chart Quoted from the official site gantt dateFormat YYYY-MM-DD title Adding GANTT diagram functionality to mermaid section A section Completed task :done, des1, 2014-01-06,2014-01-08 Active task :active, des2, 2014-01-09, 3d Future task : des3, after des2, 5d Future task2 : des4, after des3, 5d section Critical tasks Completed task in the critical line :crit, done, 2014-01-06,24h Implement parser and jison :crit, done, after des1, 2d Create tests for parser :crit, active, 3d Future task in critical line :crit, 5d Create tests for renderer :2d Add to mermaid :1d [Read More]