Mermaid guide

Mermaid Git Graph: Commits, Branches, Merges, Tags, and Cherry-Picks

The git graph draws a commit history from a short script: commit, branch, checkout, merge. It is the cleanest way to explain a branching strategy (trunk-based, Git Flow, release branches) without taking a screenshot of a real repository.

Commands are the same words you use at the terminal, so the diagram doubles as a walkthrough of what to type.

  • branching-strategy docs
  • release flow explanations
  • merge-conflict tutorials
  • git workshop slides

Example

Mermaid Git Graph examplemainfeature/themesfeature/shareinitadd 7 themeslayout slidersshare APIshare page OGv1.0 launch
gitGraph
    commit id: "init"
    branch feature/themes
    checkout feature/themes
    commit id: "add 7 themes"
    commit id: "layout sliders"
    checkout main
    merge feature/themes
    branch feature/share
    checkout feature/share
    commit id: "share API"
    commit id: "share page OG"
    checkout main
    merge feature/share
    commit id: "v1.0 launch"

Syntax

Core commands

gitGraph
    commit id: "init"
    branch develop
    checkout develop
    commit id: "feature A"
    commit id: "feature B" tag: "v0.1"
    checkout main
    merge develop
    commit id: "hotfix" type: HIGHLIGHT
Core commands — Mermaid gitmaindevelopinitfeature Afeature Bv0.1hotfix

commit options: id, tag, type (NORMAL, REVERSE, HIGHLIGHT). branch creates and checkout switches; merge merges the named branch into the current one.

Try this snippet →

Cherry-pick and orientation

gitGraph LR:
    commit id: "A"
    branch hotfix
    commit id: "H1"
    checkout main
    cherry-pick id: "H1"
    commit id: "B"
Cherry-pick and orientation — Mermaid gitmainhotfixAH1cherry-pick:H1B

gitGraph LR: (left-right), TB: (top-bottom), or BT:. Cherry-pick needs the source commit's id.

Try this snippet →

Common mistakes

These are the parse errors that come up most, including in code written by ChatGPT and Claude. Paste any failing diagram into the editor and it marks the offending line.

  • Merging a branch that has no commits since it was created.

    Fix: Add at least one commit on the branch before merge, or the merge has nothing to draw.

  • Checking out a branch before creating it.

    Fix: branch name first, then checkout name.

  • Duplicate commit ids.

    Fix: IDs must be unique. Leave id off and Mermaid generates one.

Real-world examples

Complete, copy-ready git graphs for common situations. Each one opens in the editor with a click.

Browse all examples →

FAQ

Can I rename the main branch?

Use the config mainBranchName, which the diagram text cannot set. In MermanDraw and on GitHub the default is main.

Can I hide commit labels?

Via config (showCommitLabel: false), not in the diagram text. Omit id to keep labels short instead.