⚙️ Deployment and Configuration¶
- Tutorials
- Usage
- CDN
- Using mermaid
- Simple full example:
- Notes:
- Enabling Click Event and Tags in Nodes
- securityLevel
- Usage with webpack
- API usage
- Example of a marked renderer
- Advanced usage
- Configuration
- Using the
mermaidAPI.initialize
/mermaid.initialize
call - Using the mermaid object
- Using the mermaid_config
- Using the mermaid.init call
- mermaidAPI
- Configuration
- What follows are config instructions for older versions
- theme
- fontFamily
- logLevel
- securityLevel
- startOnLoad
- arrowMarkerAbsolute
- secure
- deterministicIds
- deterministicIDSeed
- flowchart
- sequence
- activationWidth
- diagramMarginX
- diagramMarginY
- actorMargin
- width
- height
- boxMargin
- boxTextMargin
- noteMargin
- messageMargin
- messageAlign
- mirrorActors
- forceMenus
- bottomMarginAdj
- useMaxWidth
- rightAngles
- showSequenceNumbers
- actorFontSize
- actorFontFamily
- actorFontWeight
- noteFontSize
- noteFontFamily
- noteFontWeight
- noteAlign
- messageFontSize
- messageFontFamily
- messageFontWeight
- wrap
- wrapPadding
- labelBoxWidth
- labelBoxHeight
- gantt
- journey
- useMaxWidth
- defaultRenderer
- useMaxWidth
- useMaxWidth
- defaultRenderer
- er
- pie
- requirement
- setSiteConfig
- setSiteConfig
- parse
- getSiteConfig
- getSiteConfig
- setConfig
- setConfig
- getConfig
- getConfig
- sanitize
- sanitize
- addDirective
- reset
- reset
- conf
- render
- updateRendererConfigs
- initialize
- mermaidAPI configuration defaults
- Directives
- example
- Theme Configuration
- Making a Custom Theme with
themeVariables
- What follows are Variables, specific to different diagrams and charts.
- sequence diagram
- state colors
- class colors
- User journey colors
- Here is an example of overriding
primaryColor
and giving everything a different look, using%%init%%
. - Common theming activities
- mermaid CLI
- Advanced n00b mermaid (Coming soon..)