Class, sequence, use case, activity & state diagrams

Free UML Diagram Maker

A UML diagram is a picture of a software system drawn with the Unified Modeling Language, the standard visual notation for showing a system's structure, such as classes and their relationships, or its behavior, such as the messages between objects over time. Type or click below to build one, then export it as PlantUML, Mermaid, SVG, or PNG.

No login and no AI. Diagrams are drawn in your browser and saved only on this device.

Diagram source

The preview updates as you type and autosaves on this device.

Starter templates

992/20,000 characters

Syntax for class diagrams

Lines starting with ' are comments. @startuml and @enduml are optional. This is a subset of PlantUML, so the text also works in PlantUML tools.

class Order
Declare a class. Also: abstract class, interface, enum.
class Order {
  -id: UUID
  +total(): Money
}
Members, one per line. Visibility: + public, - private, # protected, ~ package. A ( makes it a method.
Customer <|-- VipCustomer
Inheritance (generalization). Also --|>.
Payable <|.. Payment
Realization of an interface. Also ..|>.
Order "1" *-- "1..*" OrderLine
Composition, filled diamond at the whole (Order). Also --*.
Team "0..1" o-- "*" Player
Aggregation, hollow diamond at the whole. Also --o.
Order --> Payment : paid by
Directed association with a label. Also <--. Plain -- for undirected.
Order ..> Clock
Dependency. Also <...

Preview

Loading the diagram renderer...

Rendered with Mermaid (MIT license) in strict security mode. Share links keep the diagram in the URL after the #, which is never sent to our server.

UML notation cheat sheet

Arrows, diamonds, and markers as defined in the OMG UML 2.5.1 specification, with the PlantUML text this tool accepts.

Class relationships

  • Association A -- B

    Solid line: instances of the two classes are linked. An open arrowhead (A --> B) shows navigability.

  • Aggregation Whole o-- Part

    Hollow diamond at the whole. A loose has-a relationship; parts can exist on their own.

  • Composition Whole *-- Part

    Filled diamond at the whole. A part belongs to at most one whole and is deleted with it.

  • Inheritance (generalization) Parent <|-- Child

    Solid line, hollow triangle at the parent. The child is a more specific kind of the parent.

  • Realization Interface <|.. Class

    Dashed line, hollow triangle at the interface. The class implements the interface.

  • Dependency Client ..> Supplier

    Dashed arrow with an open arrowhead. The client uses the supplier, so changes to it may affect the client.

Multiplicity

1
Exactly one
0..1
Zero or one (optional)
*
Zero or more, same as 0..*
1..*
One or more

Visibility

+
Public
-
Private
#
Protected
~
Package

Sequence messages

  • Synchronous ->: solid line, filled arrowhead; the caller waits
  • Asynchronous ->>: solid line, open arrowhead; no waiting
  • Reply -->: dashed line, returns from a call

PlantUML draws ->> as a thin arrowhead; this tool treats it as an asynchronous message.

Include vs extend

  • «include»: the base use case always performs the included one. The arrow points from the base to the included use case.
  • «extend»: optional or conditional behavior. The arrow points from the extending use case to the base.

How to make a UML diagram

Five steps, whether you type or click.

  1. 1

    Pick the diagram type

    Choose a class, sequence, use case, activity, or state machine diagram, or start from one of the five templates.

  2. 2

    Add elements

    Type PlantUML-style lines or use click mode to add classes, participants, actors, use cases, actions, or states.

  3. 3

    Add relationships or messages

    Connect elements with associations, inheritance, composition, messages, include and extend links, decisions, or transitions.

  4. 4

    Check the notation

    Compare arrows, diamonds, multiplicities, and visibility markers with the UML notation cheat sheet below.

  5. 5

    Export

    Copy PlantUML or Mermaid code, download .puml, .mmd, SVG, or PNG, or copy a share link.

UML diagram FAQ

What is a UML diagram?

A UML diagram is a picture of a software system drawn with the Unified Modeling Language (UML), a standard visual language maintained by the Object Management Group (OMG) for specifying, visualizing, constructing, and documenting software systems. The current version, UML 2.5.1, was released in December 2017.

What are the main types of UML diagrams?

UML 2.5.1 defines 14 diagram types, grouped into 7 structure diagrams (such as class, component, and deployment diagrams) and 7 behavior diagrams (such as use case, activity, sequence, and state machine diagrams). The most common are class, sequence, use case, activity, and state machine diagrams, which are the five this tool draws.

How do I create a UML class diagram?

List the classes, give each one its attributes and operations with a visibility marker (+ public, - private, # protected, ~ package), then connect them with association, aggregation, composition, inheritance, realization, or dependency lines and add multiplicities such as 1, 0..1, * or 1..* at each end. Here, choose Class diagram, start from the e-commerce template, type or click to add classes, and export SVG or PNG.

What is the difference between aggregation and composition?

Both mean one class is made up of others and both put a diamond at the whole's end. Aggregation (hollow diamond) is a loose has-a relationship: the parts can exist on their own, like players in a team. Composition (filled diamond) is strong ownership: a part belongs to at most one whole at a time and is deleted when the whole is deleted, like order lines in an order.

What is a sequence diagram used for?

A sequence diagram shows the messages exchanged between participants, such as users, services, and databases, in the order they happen, with time running down the page. Teams use them to design and explain API calls, login flows, and integrations. Synchronous calls use a filled arrowhead, asynchronous messages an open arrowhead, and replies a dashed line.

Is UML still used?

Yes, though usually lightly. Many teams sketch a few diagram types, most often class, sequence, and use case diagrams, to discuss a design rather than maintaining full models. One industry survey of 376 software professionals found most knew UML but 74% did not use it frequently, so quick, text-based diagrams like these are a common way to use it today.

Related free tools

Technical Requirements Template

Turn a product idea into a structured technical requirements document to pair with your diagrams.

Tech Stack Recommender

Get a recommended stack for the system you just modeled.

API Documentation Generator

Document the endpoints behind your sequence diagrams.

SOW Template Generator

Draft a statement of work for building the design.

Developer Cost Calculator

Compare the cost of hiring developers with AI-powered engineering capacity.

Code Review Checklist

Check the code that implements your design against a review checklist.

Need this architecture built?

Elite Coders gives you AI-powered developers that join your workflow, your Slack, and your GitHub, and start shipping from day one.

Start your free trial