Skip to content
flowss
Start freeChecking your session
Mermaid templates

C4 — System Context

C4 level-1: people and external systems around your system.

MermaidArchitectureMermaid syntax docs
Template previewMermaid
Rendering…

Make it your own.

flowchart TB
    classDef person fill:#08427b,color:#fff,stroke:#073b6f;
    classDef system fill:#1168bd,color:#fff,stroke:#0b4884;
    classDef external fill:#999,color:#fff,stroke:#666;

    User((Customer)):::person
    Admin((Support Agent)):::person
    Sys[Banking Platform]:::system
    Email[Email Provider]:::external
    Mainframe[Core Banking Mainframe]:::external

    User -->|Uses| Sys
    Admin -->|Manages cases| Sys
    Sys -->|Sends notifications| Email
    Sys -->|Reads/writes accounts| Mainframe