uml

Original🇺🇸 English
Translated

Create UML (Unified Modeling Language) diagrams using drawio XML format. Best for software modeling including Class, Sequence, Activity, State Machine, Component, Use Case, and Deployment diagrams. Built on drawio with UML-specific shapes and notation. NOT for simple flowcharts (use mermaid), layered system architecture (use architecture), or data charts (use vega).

17installs
Added on

NPX Install

npx skill4agent add markdown-viewer/skills uml

Tags

Translated version includes tags in frontmatter

UML Diagram Generator

Quick Start: Choose diagram type → Define classes/objects/actors → Add relationships/edges → Use appropriate shapes and arrow styles → Wrap in
```drawio
fence.
⚠️ IMPORTANT: Always use
```drawio
code fence. NEVER use
```xml
— it will NOT render as a diagram.

Critical Rules

🔗 This is a drawio-derived skill. All structure, layout, and edge routing rules inherit from drawio SKILL.md. Read the base rules first.
UML-specific additions:
  • Use standard UML shapes:
    shape=umlLifeline
    ,
    shape=umlActor
    ,
    shape=component
    ,
    swimlane;childLayout=stackLayout
  • Use
    fillColor=none;
    for package/component containers to avoid covering child elements

UML Diagram Types

TypePurposeKey ShapeExample
ClassClass structure and relationships
swimlane;childLayout=stackLayout
class-diagram.md
SequenceMessage interactions over time
shape=umlLifeline
sequence-diagram.md
ActivityWorkflow and process flow
rounded=1;arcSize=50
activity-diagram.md
State MachineObject lifecycle states
rounded=1
with colors
state-machine-diagram.md
ComponentSystem component organization
shape=component
component-diagram.md
Use CaseUser-system interactions
shape=umlActor
,
ellipse
use-case-diagram.md
DeploymentPhysical deployment architecture
shape=cube;direction=south
deployment-diagram.md
ObjectRuntime object snapshot
swimlane;fontStyle=4
object-diagram.md
PackageModule organization
shape=folder
package-diagram.md
CommunicationObject collaboration
whiteSpace=wrap
with numbered messages
communication-diagram.md
Composite StructureInternal class structure
shape=ellipse;container=1;dashed=1
composite-structure-diagram.md
Interaction OverviewActivity + sequence combination
shape=umlFrame
interaction-overview-diagram.md
TimingState changes over time
shape=waypoint
timing-diagram.md
ProfileUML extension mechanisms
<<stereotype>>
labels
profile-diagram.md