How to use the command mmdc (with examples)

The mmdc command is a CLI for mermaid, a diagram generation tool with a domain-specific language. This command takes a mermaid definition file as input and generates an SVG, PNG, or PDF file as output. It provides various options to customize the output, such as specifying the format, theme, and background color of the chart.

Use case 1: Convert a file to the specified format

Code:

mmdc --input input.mmd --output output.svg

Motivation:

The motivation for using this example is to convert a mermaid definition file input.mmd to an SVG file output.svg. This can be useful if you want to share your diagram as an image or embed it in a webpage.

Explanation:

• --input input.mmd: Specifies the input file input.mmd which contains the mermaid definition.
• --output output.svg: Specifies the output file output.svg where the generated diagram will be saved. The type of output file is determined based on the file extension provided.

Example output:

The command will generate an SVG file named output.svg containing the diagram defined in input.mmd.

Use case 2: Specify the theme of the chart

Code:

mmdc --input input.mmd --output output.svg --theme forest

Motivation:

The motivation for using this example is to customize the theme of the generated chart. By specifying the forest theme, the chart will have a green color scheme.

Explanation:

• --input input.mmd: Specifies the input file input.mmd which contains the mermaid definition.
• --output output.svg: Specifies the output file output.svg where the generated diagram will be saved.
• --theme forest: Specifies the theme of the chart. In this case, the forest theme is chosen.

Example output:

The command will generate an SVG file named output.svg containing the diagram defined in input.mmd, with a chart theme of forest.

Use case 3: Specify the background color of the chart

Code:

mmdc --input input.mmd --output output.svg --backgroundColor lime

Motivation:

The motivation for using this example is to customize the background color of the generated chart. By specifying the lime color, the chart will have a green background.

Explanation:

• --input input.mmd: Specifies the input file input.mmd which contains the mermaid definition.
• --output output.svg: Specifies the output file output.svg where the generated diagram will be saved.
• --backgroundColor lime: Specifies the background color of the chart. In this case, the color lime is chosen.

Example output:

The command will generate an SVG file named output.svg containing the diagram defined in input.mmd, with a background color of lime.

Conclusion:

The mmdc command provides a convenient way to generate diagrams from mermaid definition files. By using options such as --output, --theme, and --backgroundColor, you can customize the output to suit your needs. Whether you want to convert your diagram to a specific format, change the theme of the chart, or modify the background color, the mmdc command has you covered.