Mermaid - Ant Design X

When to Use

When you need to render Mermaid diagrams in Markdown.

Code Demo

API

Property	Description	Type	Default
children	Diagram content	`string`	-
header	Header section	`React.ReactNode \| null`	React.ReactNode
className	Style class name	`string`
classNames	Style class names	`string`	-
highlightProps	Code highlighting configuration	`highlightProps`	-

Semantic DOM

Design Token

Component TokenHow to use?

Token Name	Description	Type	Default Value
colorBgTitle	Title background color	string	rgba(0,0,0,0.06)
colorBorderCode	Code block border color	string	#f0f0f0
colorBorderGraph	Graph border color	string	#f0f0f0
colorTextTitle	Title text color	string	rgba(0,0,0,0.88)

Global TokenHow to use?