Every diagram, in every theme.

```mermaid
sequenceDiagram
  participant You
  participant Agent
  participant Mark
  You->>Agent: Draft the launch plan
  Agent->>Mark: Write plan.md
  Mark-->>You: Rendered page, live
  You->>Agent: Add the risks
  Agent->>Mark: Update plan.md
  Note over Mark: ⌘D shows what changed
```

```mermaid
stateDiagram-v2
  [*] --> Draft
  Draft --> Review: agent saves
  Review --> Draft: changes
  Review --> Approved
  Approved --> Shipped
  Shipped --> [*]
```

```mermaid
agentflow-beta TB
  flow intake["Intake"]
    issue["Issue arrives"]@{ shape: input }
  end
  flow work["Agent run"]
    plan["Plan"]@{ shape: task }
    write["Write docs"]@{ shape: task }
    plan --> write
  end
  flow out["Review"]
    open["Open in Mark"]@{ shape: action }
  end
  issue --> plan
  write --> open
```

```mermaid
usecase-beta
direction LR
actor Writer
actor Agent
Read("Read a rendered doc")
Diff("See what changed")
Write("Write Markdown")
Writer --> Read
Writer --> Diff
Agent --> Write
```

```mermaid
eventmodeling

timeframe 01 ui Editor
timeframe 02 command SaveFile [[Save01]]
timeframe 03 event FileSaved [[FileSaved]]
timeframe 04 command Reload [[Reload01]]
timeframe 05 event PageRendered [[PageRendered]]

data Save01 {
  path: 'plan.md'
  by: 'agent'
}

data Reload01 {
  path: 'plan.md'
  keepScroll: true
}

data FileSaved {
  path: string
  bytes: number
}

data PageRendered {
  blocks: number
}
```

```mermaid
classDiagram
  class Document {
    +path: string
    +markdown: string
    +render()
  }
  class Block {
    +type: string
    +source: string
  }
  class Diagram {
    +engine: Pele
    +toSvg()
  }
  Document "1" *-- "many" Block
  Block <|-- Diagram
```

```mermaid
erDiagram
  WORKSPACE ||--o{ DOCUMENT : contains
  DOCUMENT ||--|{ BLOCK : "is made of"
  AGENT }o--o{ DOCUMENT : edits
  DOCUMENT {
    string path
    datetime saved
  }
  BLOCK {
    string kind
    int line
  }
```

```mermaid
requirementDiagram
  requirement live_reload {
    id: 1
    text: "A saved file re-renders in place"
    risk: medium
    verifymethod: test
  }
  functionalRequirement keep_scroll {
    id: 1.1
    text: "Scroll position survives the reload"
    risk: low
    verifymethod: test
  }
  element file_watcher {
    type: service
  }
  live_reload - contains -> keep_scroll
  file_watcher - satisfies -> live_reload
```

```mermaid
architecture-beta
  group app(cloud)[Mark]
  service ui(server)[Editor UI] in app
  service engine(server)[Pele engine] in app
  service watcher(disk)[File watcher] in app
  service agent(internet)[Agent]
  agent:R --> L:watcher
  watcher:T --> B:ui
  ui:R --> L:engine
```

```mermaid
block
  columns 3
  md["Markdown"] arrow1<["parse"]>(right) ast["Blocks"]
  space space arrow2<["render"]>(down)
  page["Page"] arrow3<["show"]>(left) svg["SVG + HTML"]
```

```mermaid
treeView-beta
    docs/
        plan.md
        spec.md
        decisions/
            0001-engine.md
            0002-themes.md
    README.md
    CHANGELOG.md
```

```mermaid
mindmap
  root((Launch))
    Copy
      Landing
      Help center
    Product
      Onboarding
      Pricing
    Rollout
      Staff
      10%
      Everyone
```

```mermaid
quadrantChart
  title Effort vs impact
  x-axis Low effort --> High effort
  y-axis Low impact --> High impact
  quadrant-1 Plan it
  quadrant-2 Do it now
  quadrant-3 Drop it
  quadrant-4 Delegate
  Onboarding: [0.3, 0.85]
  Pricing page: [0.7, 0.8]
  Dark mode: [0.25, 0.4]
  Export to PDF: [0.75, 0.3]
  Shortcuts: [0.15, 0.62]
```

```mermaid
gitGraph
  commit id: "plan"
  branch draft
  commit id: "agent"
  commit id: "risks"
  checkout main
  merge draft
  branch fix
  commit id: "pricing"
  checkout main
  merge fix
  commit id: "v2.4"
```

```mermaid
pie title Where the time went
  "Writing" : 42
  "Review" : 26
  "Build" : 20
  "QA" : 12
```

```mermaid
xychart-beta
  title "Weekly active writers"
  x-axis [W1, W2, W3, W4, W5, W6, W7, W8]
  y-axis "Writers" 0 --> 900
  bar [220, 310, 360, 420, 510, 600, 690, 780]
  line [220, 310, 360, 420, 510, 600, 690, 780]
```

```mermaid
sankey-beta
Search,Visitors,520
Ads,Visitors,340
Referrals,Visitors,240
Visitors,Signed up,690
Visitors,Bounced,410
Signed up,Activated,470
Signed up,Dormant,220
Activated,Pro,180
Activated,Free,290
```

```mermaid
radar-beta
  title Markdown editors
  axis render["Rendering"], diagrams["Diagrams"], speed["Speed"]
  axis agents["Agent-ready"], size["Small app"]
  curve mark["Mark"]{5, 5, 4, 5, 5}
  curve other["Typical editor"]{4, 2, 3, 2, 2}
  max 5
```

```mermaid
treemap-beta
"Bundle"
    "Editor"
        "Muya": 320
        "Vue UI": 210
    "Rendering"
        "Pele": 253
        "KaTeX": 120
        "Prism": 60
    "Shell"
        "Tauri": 140
```

```mermaid
venn-beta
  title Why Mark
  set Readable
  set Editable
  set Agent-ready
  union Readable,Editable["WYSIWYG"]
  union Editable,Agent-ready["Live reload"]
  union Readable,Agent-ready["Diagrams"]
  union Readable,Editable,Agent-ready["Mark"]
```