Using mermaid in Marked 2

Nigel Metheringham's Avatar

Nigel Metheringham

06 Feb, 2020 11:32 AM


I see there are previous discussions on the use of marmaid within Marked - in particular - however I am having problems making this work for me.

I am writing documents up that will mostly be read in gitlab and so want to work with their style of mermaid support - see - and preview in Marked. So I want to use this style:-

graph TD;  
However I cannot make this work in Marked, and the settings Brett refers to the linked discussion - *You can also do it by using a fenced code block (see below) instead of a paragraph, but only if you turn off Syntax Highlighting in Style preferences.* - are no longer in the same place, nor seem to have the same effect.

Any suggestions please..

  1. Support Staff 1 Posted by Brett on 06 Feb, 2020 12:49 PM

    Brett's Avatar

    The settings have not moved, and to the best of my knowledge have the
    exact same effect. I'm not in a position to test this at the moment as
    Marked does not provide any official support for MermaidJS, but nothing
    has changed that should invalidate those previous discussions.


  2. Support Staff 2 Posted by Brett on 06 Feb, 2020 04:32 PM

    Brett's Avatar

    Just to clarify, here are the settings mentioned:

    With these settings, the following renders properly:

    <script src=""></script>
    # Frequently Asked Questions
    Documentation coming soon!
    graph LR
          A --- B
          B-->C[fa:fa-ban forbidden]
          B-->D[fa:fa-spinner ok];

Reply to this discussion

Internal reply

Formatting help / Preview (switch to plain text) No formatting (switch to Markdown)

Attaching KB article:


Attached Files

You can attach files up to 10MB

If you don't have an account yet, we need to confirm you're human and not a machine trying to post spam.

Keyboard shortcuts


? Show this help
ESC Blurs the current field

Comment Form

r Focus the comment reply box
^ + ↩ Submit the comment

You can use Command ⌘ instead of Control ^ on Mac