C4 Architecture

Turns C4 model architecture diagrams into Mermaid syntax you can drop straight into your docs. Covers all four levels: context, container, component, and deployment, plus dynamic diagrams for request flows. The skill follows C4's core philosophy that context and container diagrams are enough for most teams, only going deeper when it actually adds value. Includes practical syntax for boundaries, relationships, and styling, with examples ranging from simple PWAs to microservices deployments. Good opinionated defaults about keeping diagrams under 20 elements and always labeling relationships with verbs and technology stacks. It will analyze your codebase first to understand what needs documenting.