mermaid-diagram-patterns

Mermaid Diagram Patterns

Create clear, professional Mermaid diagrams for technical documentation.

When to Use

• Database schema visualization (ERD)
• API interaction sequences
• Process and workflow flowcharts
• System architecture diagrams
• State machines and user journeys
• Decision trees

Diagram Type Selection

Scenario	Diagram Type	Mermaid Syntax
Database schema	ERD	erDiagram
API calls	Sequence	sequenceDiagram
Process flow	Flowchart	graph TD or flowchart TD
Component architecture	Flowchart	graph LR
State transitions	State	stateDiagram-v2
User workflow	Journey	journey
Project timeline	Gantt	gantt
Class relationships	Class	classDiagram

ERD Pattern (Database Schema)

Use for entity definitions in technical design documents.

erDiagram
    %% Entity definitions with attributes
    PATIENT {
        uuid Id PK
        string FirstName
        string LastName
        string Email UK
        string Phone
        date DateOfBirth
        timestamp CreationTime
        uuid CreatorId FK
        boolean IsDeleted
    }

    DOCTOR {
        uuid Id PK
        string FullName
        string Specialization
        string Email UK
        string Phone
    }

    APPOINTMENT {
        uuid Id PK
        uuid PatientId FK
        uuid DoctorId FK
        timestamp AppointmentDate
        string Description
        smallint Status "0=Scheduled,1=Completed,2=Cancelled"
    }

    %% Relationships
    PATIENT ||--o{ APPOINTMENT : "has"
    DOCTOR ||--o{ APPOINTMENT : "conducts"

ERD Conventions

Symbol	Meaning
PK	Primary Key
FK	Foreign Key
UK	Unique Key
`
`
}o--o{	Many-to-Many

Sequence Diagram Pattern (API Interactions)

Use for documenting API flows in technical design.

sequenceDiagram
    autonumber
    participant C as Client
    participant API as API Gateway
    participant S as AppService
    participant DB as Database

    C->>+API: POST /api/app/patients
    API->>API: Validate JWT
    API->>+S: CreateAsync(dto)
    S->>S: Validate input
    S->>+DB: Insert Patient
    DB-->>-S: Patient entity
    S-->>-API: PatientDto
    API-->>-C: 201 Created

    Note over C,DB: Error handling
    C->>+API: POST /api/app/patients (invalid)
    API->>+S: CreateAsync(dto)
    S-->>-API: ValidationException
    API-->>-C: 400 Bad Request