Mermaid Diagram Editor

Create flowcharts, sequence diagrams, and more with live preview. Copy as markdown or export as image.

Mermaid Code

Preview

Loading Mermaid...

Diagram Types

Flowchart

flowchart TD
    A[Start] --> B{Decision}
    B -->|Yes| C[Action]
    B -->|No| D[End]

Sequence Diagram

sequenceDiagram
    Alice->>Bob: Hello
    Bob-->>Alice: Hi!

Class Diagram

classDiagram
    Animal <|-- Duck
    Animal : +age int
    Duck : +swim()

State Diagram

stateDiagram-v2
    [*] --> Active
    Active --> Inactive
    Inactive --> [*]

Share Your Diagrams Instantly

markshare renders Mermaid diagrams beautifully. Create documentation with diagrams and share it as a webpage in seconds.

Try markshare Free

Frequently Asked Questions

What is Mermaid?

Mermaid is a JavaScript-based diagramming tool that uses text-based definitions to create diagrams. You write simple text, and Mermaid renders beautiful flowcharts, sequence diagrams, class diagrams, and more.

Can I use Mermaid in GitHub?

Yes! GitHub natively supports Mermaid diagrams in markdown files. Just wrap your Mermaid code in a fenced code block with "mermaid" as the language identifier.

What diagram types are supported?

Mermaid supports flowcharts, sequence diagrams, class diagrams, state diagrams, entity-relationship diagrams, user journey diagrams, Gantt charts, pie charts, and more.

Is my diagram data saved?

No. Everything happens in your browser. Your diagram code is never sent to our servers. To save your work, copy the code or export the image.