From plantuml
Invoked automatically before creating PlantUML diagrams to select the correct type. Covers 17 types: sequence, activity, state, class, ER, component, deployment, timing, mindmap, gantt, WBS, JSON, YAML, network, object, usecase, wireframe. Do NOT create PlantUML without consulting this guide. Keywords: diagram type, which diagram, best diagram, choose diagram, UML.
npx claudepluginhub tribe-coding/claude-plugins --plugin plantumlThis skill uses the workspace's default tool permissions.
Use this guide to choose the right PlantUML diagram type for documentation. When creating or updating `.md` files, proactively suggest and use the appropriate diagram type.
Generates design tokens/docs from CSS/Tailwind/styled-components codebases, audits visual consistency across 10 dimensions, detects AI slop in UI.
Records polished WebM UI demo videos of web apps using Playwright with cursor overlay, natural pacing, and three-phase scripting. Activates for demo, walkthrough, screen recording, or tutorial requests.
Delivers idiomatic Kotlin patterns for null safety, immutability, sealed classes, coroutines, Flows, extensions, DSL builders, and Gradle DSL. Use when writing, reviewing, refactoring, or designing Kotlin code.
Use this guide to choose the right PlantUML diagram type for documentation. When creating or updating .md files, proactively suggest and use the appropriate diagram type.
IMPORTANT: Every diagram MUST include a title directive immediately after the opening tag. This makes diagrams self-documenting. Example: title User Authentication Flow
Color coding: Read
references/colors.mdfor the muted pastel palette, color support by diagram type, and legend guidance.
| Type | When to use | When to suggest | Syntax |
|---|---|---|---|
| Sequence | Interactions between processes/services, API call flows, request-response chains. For ≤ 10 arrows add hide footbox; for longer diagrams keep footbox for navigation | Spec files with pipeline/API descriptions; new inter-process communication | @startuml with ->, -->, ->> |
| Activity | Algorithms, business logic, decision trees, branching flows, parallel processes | Decision log entries; complex functions with many branches; CI/CD procedures | @startuml with start, :action;, if/then/else, fork |
| State | State machines, object lifecycles, connection/session/process states | Code with if/else chains that implement a state machine; specs describing behavior with distinct states | @startuml with [*] -->, state |
| Use Case | Functional requirements, actor-system interactions, feature overview | PRD files; new feature overview; user stories | @startuml with actor, usecase, --> |
| Timing | Time-based event characteristics, latency profiling, synchronization, timeout/retry logic | Performance documentation; pipeline latency analysis | @startuml with concise/robust, @ |
Before creating any sequence diagram, read
references/sequence.mdfor ACK suppression rules, arrow conventions, and visual styling defaults.
| Type | When to use | When to suggest | Syntax |
|---|---|---|---|
| Component / Package | High-level system architecture, layers, module dependencies | Architecture docs; adding new modules; specs showing system composition | @startuml with package, component, [name] |
| Class | Class hierarchies, interfaces, data models (dataclasses, Pydantic), entity relationships | Adding new classes/models; refactoring class hierarchy; storage/query models | @startuml with class, interface, inheritance arrows |
| Object | Snapshot of object instances with actual data at a specific point in time | Debugging documentation; showing concrete state examples; test data illustration | @startuml with object, field values |
| ER (Entity-Relationship) | Database schemas, table relationships with cardinalities (1:N, M:N) | Database storage design; any database work | @startuml with entity, field definitions, ||--o{ |
| Deployment | Physical deployment topology: processes, threads, file system, cache, network | Architecture deployment docs; Web UI with server + WebSocket | @startuml with node, artifact, database |
| Network (nwdiag) | Network topology, servers, subnets, ports | Infrastructure documentation; service communication topology | @startuml with nwdiag { network ... } |
| Type | When to use | When to suggest | Syntax |
|---|---|---|---|
| JSON | Visualize data structures, config files, API request/response formats | API contract documentation; config file structure | @startjson |
| YAML | Same as JSON but for YAML-formatted configs | YAML config documentation | @startyaml |
| Type | When to use | When to suggest | Syntax |
|---|---|---|---|
| MindMap | Brainstorming, idea hierarchies, feature categorization, project structure overview | Planning new phases; feature overview; backlog/roadmap organization | @startmindmap with *, **, *** |
| Gantt | Project timelines, phase planning, task dependencies, milestones | Roadmap documentation; sprint/phase planning | @startgantt with [Task] lasts X days |
| WBS | Work decomposition, task hierarchy, scope visualization | Planning a new phase; breaking Epic into Stories/Tasks | @startwbs with *, ** |
| Wireframe (Salt) | UI mockups, interface layouts, form structures | UI design; UI-related PRDs | @startsalt with { } layout blocks |