Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>Mermaid: Syntax Highlighting for MarkdownNew to Visual Studio Code? Get it now.
Mermaid: Syntax Highlighting for Markdown

Mermaid: Syntax Highlighting for Markdown

castachick

|
930 installs
| (0) | Free
Markdown syntax support for the Mermaid charting language
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

vscode-mermaid-syntax-highlight

[!IMPORTANT] This extension is forked from [https://github.com/bpruitt-goddard/vscode-mermaid-syntax-highlight]. The original extension is not maintained anymore. This fork is maintained by CastaChick.

Syntax support for the Mermaid charting language

Version Installs Ratings

Supports both fenced markdown (see screenshots), and mmd files.

Screenshots/Diagrams

Graph

Graph Screenshot

Sequence

Sequence Diagram Screenshot

Gantt

Gantt Diagram Screenshot

Pie

Pie Chart Screenshot

Class Diagram

Class Diagram Screenshot

State Diagram

State Diagram Screenshot

Entity Relationship Diagrams

Entity Relationship Diagram Screenshot

Git Graph

Git Graph Screenshot

User Journey

User Journey Screenshot

Requirements Diagram

Requirements Diagram Screenshot

Quadrant Chart

Quadrant Chart Screenshot

Architecture Diagram

Architecture Diagram Screenshot

ADO Support

Supports highlighting in Azure Dev Ops (ADO) colon syntax:

ADO Syntax Screenshot

Initial Idea

Based on the starter language support repo here, and initially created based on the Atom language support here.

Contributing

For information on how to build/test/contribute, see the Contributing Guide.

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft