A

Architecture Diagram Creator

Creates comprehensive HTML architecture diagrams with SVG visualizations showing business context, data flows, processing pipelines, and system architecture

Bymhattingpete
Home/Dev/Architecture Diagram Creator

WhatIsIt

Creates comprehensive HTML architecture diagrams with SVG visualizations showing business context, data flows, processing pipelines, and system architecture Built for use cases involving architecture-diagram, visualization, svg, system-design, documentation.

HowToUse

Install this skill in your Claude environment to enhance architecture diagram creator capabilities. Once installed, Claude will automatically apply the skill's guidelines when relevant tasks are detected. You can also explicitly invoke it by referencing its name in your prompts.

The full source and documentation is available on GitHub.

KeyFeatures

  • Creates comprehensive HTML architecture diagrams with SVG visualizations showing business context, data flows, processing pipelines, and system architecture
  • Automated documentation generation
  • Seamless integration with Claude's development workflow
ViewOnGitHub

GithubStats

Stars
Forks
LastUpdate
License
Apache-2.0
Version
1.0.0

Categories

Dev
Design

Tags

architecture-diagram
visualization
svg
system-design
documentation

Features

RelatedSkills

MoreFrom

Flowchart Creator

Creates HTML flowcharts and process diagrams with SVG-based nodes, decision diamonds, connecting arrows, and optional swimlanes with color-coded types

Dev
Design

Web Asset Generator

Generate favicons, app icons (PWA), and social media Open Graph images from logos or text

Design
Dev

Frontend Design

Guides Claude to create distinctive, production-grade frontend interfaces with high design quality, covering typography, color, motion, spatial composition, and background treatments

Design
Dev