Basic example
Syntax overview
Mermaid supports the basic Git operations:- commit - Representing a new commit on the current branch
- branch - To create and switch to a new branch
- checkout - To check out an existing branch and set it as current
- merge - To merge an existing branch onto the current branch
checkout and switch can be used interchangeably.Basic commits
A simple gitgraph showing three commits on the default (main) branch:Custom commit IDs
You can specify custom IDs for commits:Commit types
Commits can be of three types:- NORMAL - Default type, represented by a solid circle
- REVERSE - Emphasized as a reverse commit, shown with a crossed solid circle
- HIGHLIGHT - Highlighted commit, shown as a filled rectangle
Tags
You can attach tags to commits:Branches and merging
Creating branches
Use thebranch keyword to create a new branch:
Checking out branches
Switch between branches usingcheckout:
Merging branches
Merge branches using themerge keyword:
You can customize merge commits with attributes:
Cherry picking
Cherry-pick commits from other branches:When cherry-picking a merge commit, you must specify the parent commit ID using the
parent attribute.Configuration options
Show/hide branches
Show/hide branches
Control branch visibility with
showBranches:Commit label orientation
Commit label orientation
Control label rotation with
rotateCommitLabel:Hide commit labels
Hide commit labels
Hide commit labels with
showCommitLabel:Custom main branch name
Custom main branch name
Customize the main branch name:
Branch ordering
Branch ordering
Control branch order with the
order keyword:Orientation
Git graphs support three orientations:Left to right (default)
Top to bottom
Bottom to top
Theming
Customizing branch colors
Customizing branch colors
Use
git0 to git7 theme variables to customize branch colors:Customizing commit labels
Customizing commit labels
Use
commitLabelColor and commitLabelBackground to style commit labels: