C4 Diagramc4architecturecontext

System Context C4 Diagram

Document your system boundary with a Mermaid C4 context diagram for users, the product, identity, payments, email, and analytics.

Edit this template Browse all templates

Use Cases

Introduce a system before a deeper architecture review

Clarify external dependencies and user relationships

Add a simple context diagram to technical documentation

Explain vendor boundaries for identity, email, payments, and analytics during onboarding

How This Workflow Works

Step	Purpose
User	Identifies the primary person or role that interacts with the system boundary.
Central system	Defines the product, application, or service being explained by the context diagram.
Identity provider	Shows where authentication and session validation happen outside the main system.
Email and payments	Maps operational vendors that support notifications, billing, receipts, or subscription events.
Analytics	Shows where product usage or business events leave the system for measurement.

How To Customize

Rename the central system to your product or service

Replace external systems with your actual vendors

Add relationship labels that explain data or trust boundaries

Add internal user roles such as admins, operators, or API clients

Remove vendors that are not in scope so the context diagram stays high level

Edit This Template Visually

Open this template in the editor to work from the rendered diagram and the Mermaid source together. Click a node in supported flowchart and sequence diagrams to locate the matching code, select source lines to find the related shape, or ask AI to rename, expand, restyle, or rewrite the selected part of the workflow.

Mermaid Source

C4Context
    title SaaS System Context

    Person(user, "User", "Creates and manages diagrams")
    System(app, "Mermaid Editor", "Edits, renders, and exports Mermaid diagrams")
    System_Ext(identity, "Identity Provider", "Authenticates users")
    System_Ext(email, "Email Service", "Sends notifications")
    System_Ext(payment, "Payment Provider", "Processes billing events")
    System_Ext(analytics, "Analytics", "Measures product usage")

    Rel(user, app, "Uses")
    Rel(app, identity, "Validates sessions")
    Rel(app, email, "Sends email")
    Rel(app, payment, "Creates checkout sessions")
    Rel(app, analytics, "Tracks events")