UML Diagram Generator
Quick Start: Choose diagram type → Write PlantUML text → Define elements and relationships → Wrap in ```plantuml fence.
⚠️ IMPORTANT: Always use ```plantuml or ```puml code fence. NEVER use ```text — it will NOT render as a diagram.
Critical Rules
- Every diagram starts with
@startuml and ends with @enduml
- Use standard PlantUML keywords:
class, interface, abstract, enum, actor, participant, component, node, database, package
- Relationships use arrow syntax:
-->, <|--, *--, o--, ..>, ..|>
- Use
skinparam for global styling and colors
- Use
#color on individual elements for specific colors
- Notes use
note left of, note right of, note over, or standalone note "text" as N
UML Diagram Types
| Type |
Purpose |
Key Syntax |
Example |
| Class |
Class structure and relationships |
class, interface, <|-- |
class-diagram.md |
| Sequence |
Message interactions over time |
participant, ->, --> |
sequence-diagram.md |
| Activity |
Workflow and process flow |
start, :action;, if/else |
activity-diagram.md |
| Swimlane Activity |
Multi-role activity with swimlanes |
|Lane|, :action; |
swimlane-activity-diagram.md |
| State Machine |
Object lifecycle states |
state, [*] --> |
state-machine-diagram.md |
| Component |
System component organization |
component, [name], interface |
component-diagram.md |
| Use Case |
User-system interactions |
actor, usecase, (name) |
use-case-diagram.md |
| Deployment |
Physical deployment architecture |
node, artifact, database |
deployment-diagram.md |
| Object |
Runtime object snapshot |
object "name" as id |
object-diagram.md |
| Package |
Module organization |
package "name" |
package-diagram.md |
| Communication |
Object collaboration |
Numbered messages with sequence syntax |
communication-diagram.md |
| Composite Structure |
Internal class structure |
component with nested port |
composite-structure-diagram.md |
| Interaction Overview |
Activity + sequence combination |
group, ref over |
interaction-overview-diagram.md |
| Profile |
UML extension mechanisms |
<<stereotype>> labels |
profile-diagram.md |
Mxgraph Stencil Icons
draw-uml supports 9500+ mxgraph stencil icons (AWS, Azure, Cisco, Kubernetes, etc.) via the mxgraph.* syntax. Default colors are applied automatically — you do NOT need to specify fillColor or strokeColor.
Full stencil reference: See stencils/README.md.
Syntax
mxgraph.<namespace>.<icon> "Label" as <alias>
mxgraph.<namespace>.<icon> "Label" as <alias> #color
mxgraph.<namespace>.<icon> <alias>
mxgraph.<namespace>.<icon> — the stencil shape key (e.g. mxgraph.aws4.lambda, mxgraph.kubernetes.pod)
"Label" — display text (quoted if contains spaces, unquoted for single word)
as <alias> — identifier for use in relationships
#color — optional override color (e.g. #FF6600, #LightBlue)
Examples
@startuml
' Simple icon declaration
mxgraph.aws4.lambda "Lambda\nFunction" as fn
mxgraph.aws4.api_gateway "API GW" as gw
mxgraph.aws4.dynamodb "DynamoDB" as db
gw --> fn
fn --> db
@enduml
@startuml
' Kubernetes architecture with icons
mxgraph.kubernetes.ing "Ingress" as ing
mxgraph.kubernetes.svc "Service" as svc
mxgraph.kubernetes.pod "Pod" as pod
mxgraph.kubernetes.deploy "Deployment" as deploy
ing --> svc
svc --> pod
deploy --> pod
@enduml
@startuml
' Mixing standard UML with stencil icons
node "Cloud" {
mxgraph.aws4.ec2 "EC2" as ec2
mxgraph.aws4.rds "RDS" as rds
}
database "Legacy DB" as legacy
ec2 --> rds
rds --> legacy
@enduml
1---2name: uml3description: Create UML diagrams using PlantUML syntax. Best for software modeling — Class, Sequence, Activity, State Machine, Component, Use Case, and Deployment diagrams with concise text-based notation and auto-layout.4---5
6# UML Diagram Generator
7**Quick Start:** Choose diagram type → Write PlantUML text → Define elements and relationships → Wrap in ` ```plantuml ` fence.
8> ⚠️ **IMPORTANT:** Always use ` ```plantuml ` or ` ```puml ` code fence. NEVER use ` ```text ` — it will NOT render as a diagram.
9
10## Critical Rules
11
12- Every diagram starts with `@startuml` and ends with `@enduml`
13- Use standard PlantUML keywords: `class`, `interface`, `abstract`, `enum`, `actor`, `participant`, `component`, `node`, `database`, `package`
14- Relationships use arrow syntax: `-->`, `<|--`, `*--`, `o--`, `..>`, `..|>`
15- Use `skinparam` for global styling and colors
16- Use `#color` on individual elements for specific colors
17- Notes use `note left of`, `note right of`, `note over`, or standalone `note "text" as N`
18
19## UML Diagram Types
20| Type | Purpose | Key Syntax | Example |
21|------|---------|------------|---------|
22| Class | Class structure and relationships | `class`, `interface`, `<\|--` | [class-diagram.md](examples/class-diagram.md) |
23| Sequence | Message interactions over time | `participant`, `->`, `-->` | [sequence-diagram.md](examples/sequence-diagram.md) |
24| Activity | Workflow and process flow | `start`, `:action;`, `if/else` | [activity-diagram.md](examples/activity-diagram.md) |
25| Swimlane Activity | Multi-role activity with swimlanes | `\|Lane\|`, `:action;` | [swimlane-activity-diagram.md](examples/swimlane-activity-diagram.md) |
26| State Machine | Object lifecycle states | `state`, `[*] -->` | [state-machine-diagram.md](examples/state-machine-diagram.md) |
27| Component | System component organization | `component`, `[name]`, `interface` | [component-diagram.md](examples/component-diagram.md) |
28| Use Case | User-system interactions | `actor`, `usecase`, `(name)` | [use-case-diagram.md](examples/use-case-diagram.md) |
29| Deployment | Physical deployment architecture | `node`, `artifact`, `database` | [deployment-diagram.md](examples/deployment-diagram.md) |
30| Object | Runtime object snapshot | `object "name" as id` | [object-diagram.md](examples/object-diagram.md) |
31| Package | Module organization | `package "name"` | [package-diagram.md](examples/package-diagram.md) |
32| Communication | Object collaboration | Numbered messages with sequence syntax | [communication-diagram.md](examples/communication-diagram.md) |
33| Composite Structure | Internal class structure | `component` with nested `port` | [composite-structure-diagram.md](examples/composite-structure-diagram.md) |
34| Interaction Overview | Activity + sequence combination | `group`, `ref over` | [interaction-overview-diagram.md](examples/interaction-overview-diagram.md) |
35| Profile | UML extension mechanisms | `<<stereotype>>` labels | [profile-diagram.md](examples/profile-diagram.md) |
36
37## Mxgraph Stencil Icons
38
39draw-uml supports 9500+ mxgraph stencil icons (AWS, Azure, Cisco, Kubernetes, etc.) via the `mxgraph.*` syntax. Default colors are applied automatically — you do NOT need to specify `fillColor` or `strokeColor`.
40
41**Full stencil reference:** See [stencils/README.md](stencils/README.md).
42
43### Syntax
44
45```
46mxgraph.<namespace>.<icon> "Label" as <alias>
47mxgraph.<namespace>.<icon> "Label" as <alias> #color
48mxgraph.<namespace>.<icon> <alias>
49```
50
51- `mxgraph.<namespace>.<icon>` — the stencil shape key (e.g. `mxgraph.aws4.lambda`, `mxgraph.kubernetes.pod`)
52- `"Label"` — display text (quoted if contains spaces, unquoted for single word)
53- `as <alias>` — identifier for use in relationships
54- `#color` — optional override color (e.g. `#FF6600`, `#LightBlue`)
55
56### Examples
57
58```plantuml
59@startuml
60' Simple icon declaration
61mxgraph.aws4.lambda "Lambda\nFunction" as fn
62mxgraph.aws4.api_gateway "API GW" as gw
63mxgraph.aws4.dynamodb "DynamoDB" as db
64
65gw --> fn
66fn --> db
67@enduml
68```
69
70```plantuml
71@startuml
72' Kubernetes architecture with icons
73mxgraph.kubernetes.ing "Ingress" as ing
74mxgraph.kubernetes.svc "Service" as svc
75mxgraph.kubernetes.pod "Pod" as pod
76mxgraph.kubernetes.deploy "Deployment" as deploy
77
78ing --> svc
79svc --> pod
80deploy --> pod
81@enduml
82```
83
84```plantuml
85@startuml
86' Mixing standard UML with stencil icons
87node "Cloud" {
88 mxgraph.aws4.ec2 "EC2" as ec2
89 mxgraph.aws4.rds "RDS" as rds
90}
91database "Legacy DB" as legacy
92
93ec2 --> rds
94rds --> legacy
95@enduml
96```