Mermaid Class Diagrams Templates

Mermaid class diagram templates for OOP patterns, e-commerce, and architecture.

3 templates · Click "Use in Editor" to open any template and customize it instantly. No sign-up required.

classDiagram
    class Customer {
        +String id
        +String name
        +String email
        +placeOrder(items) Order
    }
    class Order {
        +String id
        +Date createdAt
        +String status
        +getTotal() Decimal
        +cancel() void
    }
    class OrderItem {
        +Product product
        +int quantity
        +Decimal unitPrice
    }
    class Product {
        +String id
        +String name
        +Decimal price
        +int stock
        +isInStock() bool
    }

    Customer "1" --> "*" Order : places
    Order "1" --> "1..*" OrderItem : contains
    OrderItem "*" --> "1" Product : references

classDiagram
    class Model {
        <<abstract>>
        #data: Map
        +getData() Map
        +setData(key, value) void
        +notify() void
    }
    class View {
        <<abstract>>
        -model: Model
        +render() void
        +update() void
    }
    class Controller {
        <<abstract>>
        -model: Model
        -view: View
        +handleInput(event) void
    }

    class UserModel {
        +String name
        +String email
    }
    class UserView {
        +render() void
        +showError(msg) void
    }
    class UserController {
        +handleLogin() void
        +handleLogout() void
    }

    Model <|-- UserModel
    View <|-- UserView
    Controller <|-- UserController
    Controller --> Model : updates
    Controller --> View : updates
    View --> Model : reads

classDiagram
    class Subject {
        <<interface>>
        +attach(observer) void
        +detach(observer) void
        +notify() void
    }
    class Observer {
        <<interface>>
        +update(subject) void
    }
    class EventEmitter {
        -observers: Observer[]
        +attach(observer) void
        +detach(observer) void
        +notify() void
    }
    class Logger {
        +update(subject) void
    }
    class Analytics {
        +update(subject) void
    }
    class UI {
        +update(subject) void
    }

    Subject <|.. EventEmitter
    Observer <|.. Logger
    Observer <|.. Analytics
    Observer <|.. UI
    EventEmitter --> Observer : notifies