architecture-diagram
Installation
SKILL.md
Architecture Diagram
End-to-end architecture diagram generation. Gathers system information, produces an HTML file, renders it to PNG via Chrome headless, and delivers the final image. The entire export is automated -- the user never needs to open a browser or run a script manually.
Two visual styles: dark theme (default, SVG-based) and light theme (div-based, print-friendly).
Workflow
Step 1: Gather information
Before writing markup, identify from the request (ask clarifying questions if anything is ambiguous):
- Components: servers, services, databases, queues, external systems
- Data flow: direction of requests (top-down, left-to-right, mixed)
- Groupings: which components belong together (VPC, cluster, tier)
- Boundary types: cloud regions, security groups, Kubernetes namespaces
- Theme: dark (default) or light (for print/slides/white-background docs)
- Output path: where to save the final PNG (default:
tmp/in the project directory)