1001Ferramentas
🧱Generators

UML Class Diagram (Mermaid)

Build Mermaid classDiagram from a list of classes with attributes and methods.


  

UML class diagrams: the static structure of an object-oriented system

A class diagram is the canonical UML view of the static structure of an object-oriented design. It shows the classes that compose the system, the attributes and operations of each class, and the relationships that link them. Class diagrams predate UML β€” they trace back to the OMT, Booch, and OOSE notations of the early 1990s β€” and were unified into UML 1.0 in 1997. The diagram you draw today, in UML 2.5.1, looks substantially the same as the one your predecessors drew thirty years ago.

Unlike a sequence diagram (temporal) or a state diagram (behavioural), the class diagram is timeless: it describes the shape of objects and how they are wired, not what they do or in which order. That makes it the workhorse view for documenting domain models, designing APIs, and explaining patterns.

Anatomy of a class

A class is drawn as a rectangle with three compartments stacked vertically:

β”Œβ”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”
β”‚      Account         β”‚   ← name (italic = abstract)
β”œβ”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€
β”‚ - balance: Decimal   β”‚   ← attributes
β”‚ + owner: User        β”‚
β”œβ”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€
β”‚ + deposit(x: Decimal)β”‚   ← operations (methods)
β”‚ + withdraw(x): bool  β”‚
β”‚ + getBalance(): Dec  β”‚
β””β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”˜

Visibility prefixes: + public, - private, # protected, ~ package. Each attribute is typed name: Type; each operation is name(arg: Type): ReturnType. Underline marks a member as static; italic marks a class or operation as abstract. Stereotypes such as <<interface>>, <<abstract>>, and <<enumeration>> appear above the class name to refine its kind.

Relationships: the six lines that connect classes

  • Association β€” plain solid line. "An Order uses a Customer." The weakest structural link.
  • Aggregation β€” solid line with an open diamond at the whole. "A Team has Players (loose has-a)." Parts survive the whole.
  • Composition β€” solid line with a filled diamond. "A House is composed of Rooms (strong part-of)." Parts die with the whole.
  • Inheritance / Generalisation β€” solid line with a hollow triangle at the parent. "A Dog is-a Animal."
  • Realisation / Implementation β€” dashed line with a hollow triangle. "ArrayList implements List."
  • Dependency β€” dashed arrow. "OrderService depends on MailSender (uses transiently)."

Multiplicity labels each end with a cardinality: 1, 0..1, * (zero or more), 1..* (one or more), 2..5.

Mermaid classDiagram syntax

classDiagram
  class Animal {
    +String name
    +int age
    +eat()
    +sleep()
  }
  class Dog {
    +String breed
    +bark()
  }
  class Owner {
    +String name
  }
  Animal <|-- Dog          : inheritance
  Animal "1" o-- "*" Owner : aggregation
  <<interface>> Comparable
  Animal ..|> Comparable   : realisation

Mermaid supports generic types with tilde syntax: class List~T~. The classDiagram parser also accepts -- for association, *-- for composition, ..> for dependency.

Good practice: how big should a class diagram be?

Cognitive science offers a hard limit: George Miller's classic "7 Β± 2" rule says working memory holds five to nine chunks. Aim for seven classes per diagram, never more than nine. If the system has fifty classes, draw five diagrams grouped by package or module, each focused on a pattern or feature β€” Composite for the rendering subsystem, Strategy for billing, Observer for the event bus. Show only the relationships that matter for the story; an exhaustive diagram is unreadable. Annotate each diagram with the design pattern it illustrates.

Tools, code generation, and reverse engineering

Diagrams-as-code: Mermaid, PlantUML. Visual editors: StarUML, Visual Paradigm, Lucidchart, draw.io. IntelliJ IDEA Ultimate ships native UML diagrams that derive directly from compiled bytecode. The two complementary workflows are code generation (UML β†’ scaffolded code, popular in MDA tooling) and reverse engineering (code β†’ UML, useful when joining a legacy project).

FAQ

Hasn't UML been replaced by something more modern? For high-level architecture, many teams have moved to the C4 Model (Context, Container, Component, Code) by Simon Brown, or to arc42. For class-level design UML class diagrams remain the lingua franca β€” every major IDE understands them.

Can I show generic / parameterised types? Yes β€” Mermaid uses ~T~: class Repository~T~. Pure UML draws a small dashed-corner rectangle in the top-right of the class with the parameter name.

My diagram has too many relationship lines. Help? Split it. Move the noisy subset into a focused diagram and replace the connections in the parent diagram with a single dependency to that subsystem package.

What's the difference between aggregation and composition? Lifetime. With composition, deleting the whole deletes the parts (House β†’ Rooms). With aggregation, the parts can outlive the whole (Team β†’ Players).

Should I include private methods? Only in diagrams aimed at implementers. Architecture-level diagrams stick to public members and stereotypes.

Related Tools