architecture-diagram-generator

Why we included this project

If your team works in Claude or Claude Code, this skill turns a plain-language description of a system into a polished, dark-themed architecture diagram you can open in any browser. Describe components and connections, say a React frontend talking to a Node API with PostgreSQL and Redis behind it, and the skill returns a single self-contained HTML file with the SVG baked in, plus Copy, PNG, and PDF export buttons. That makes it useful for engineers and tech leads who want a credible diagram for docs or slide decks without hand-drawing boxes and arrows. Since the output is one portable file, sharing with teammates means just sending it along, and you can keep iterating in chat to add components or adjust the layout. The whole thing needs no design skills and no extra software, so it works when you want a quick visual, not a full diagramming tool.