Top-level configuration options

These are configuration options that apply to Mermaid itself or all diagram types. They are listed here, as follows:

• theme (string)

  With this option, you set a predefined graphical theme. The possible values are default (the default value), base, forest, dark, and neutral. To stop any predefined theme from being used, set a null or default value.

  Default value: 'default'

  Here is an example of an init directive that uses the theme option:

  %%{init: { "theme": "default" }}%%

• themeCSS (string)

  You can insert styling into rendered diagrams using this configuration option (you will benefit from some knowledge of Cascading Style Sheets (CSS) to successfully use this option).

  Default value: -

  Here is an example of an init directive setting the themeCSS option:

  %%{init: { "themeCss": ".node rect { fill: red;" }}}%%

• fontFamily (string)

  This option lets you specify the font to be used in rendered...