Sponsor Suno AI Music arrow_forward
Skill

Architecture Diagram Creator

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

Type
Skill
GitHub stars
679
License
Apache-2.0
Repo last updated
Jul 25, 2026
Source file
README.md

What Architecture Diagram Creator is

Architecture Diagram Creator is a skill published in the mhattingpete/claude-skills-marketplace repository on GitHub, which has about 679 stars. The repository describes itself as: “Claude Code Skills for software engineering workflows - Git automation, testing, and code review”

A skill is a folder with a SKILL.md file: frontmatter with a name and a description, followed by instructions Claude follows. Claude loads a skill automatically when a task matches its description, and you can also run it directly with a slash and its name.

Skills work in Claude Code and in Claude Cowork, which makes Architecture Diagram Creator a portable way to give Claude the same method everywhere.

How to install Architecture Diagram Creator

Claude Code

  1. Download the architecture-diagram-creator folder from the repository.
  2. Save it as ~/.claude/skills/<skill-name>/SKILL.md for all projects, or .claude/skills/<skill-name>/SKILL.md for one project.
  3. Claude loads it automatically when a task matches; you can also run it with / and its name.

Claude Cowork

  1. Zip the skill folder so SKILL.md sits at the top level of the folder.
  2. Open Customize → Skills, click +, then upload the ZIP.
  3. Start a task that matches the description, or call it by name with /.

New to extending Cowork? Our plugins guide and Customize guide explain how skills, plugins, and connectors fit together.

Inside the source file

An excerpt from README.md, shared under the repository's Apache-2.0 license. Read the full file on GitHub.

A curated marketplace of Claude Code plugins for software engineering workflows.

Repository Structure

claude-skills-marketplace/
├── .claude-plugin/
│   └── marketplace.json              # Marketplace manifest
├── execution-runtime/                 # 🚀 Code execution environment (NEW!)
│   ├── api/                           # Importable API library
│   ├── mcp-server/                    # FastMCP server
│   ├── setup.sh                       # One-command installation
│   └── README.md
├── engineering-workflow-plugin/       # Engineering workflow plugin
│   ├── .claude-plugin/
│   │   └── plugin.json               # Plugin manifest
│   ├── agents/
│   │   └── plan-implementer.md       # Plan implementation agent
│   ├── skills/
│   │   ├── feature-planning/         # Feature planning skill
│   │   ├── git-pushing/              # Git automation skill
│   │   ├── review-implementing/      # Code review skill
│   │   └── test-fixing/              # Test fixing skill
…

What are Skills and Agents?

Skills are model-invoked capabilities that extend Claude Code's functionality. Unlike slash commands that require explicit user activation, Skills are automatically triggered by Claude based on context and the Skill's description.

Each Skill consists of a SKILL.md file with:

  • YAML frontmatter (name, description, metadata)
  • Detailed instructions for Claude
  • Optional supporting files (scripts, templates, references)

Agents are specialized Claude instances that can be invoked by Claude to handle specific types of work. They run independently with their own context and can use different models optimized for their task.

Each Agent consists of an AGENT.md file with:

  • YAML frontmatter (name, description, model selection)
  • Specialized instructions and constraints
  • Decision-making frameworks for their domain

Skills and Agents work together: Skills can orchestrate when to invoke Agents, and Agents can use Skills while executing their tasks.

🚀 NEW: Execution Runtime (90%+ Token Savings)

The marketplace now includes a code execution environment implementing the Anthropic code execution pattern. Instead of loading code through context, Claude executes Python locally with API access—achieving 90-99% token reduction for bulk operations.

Quick Benefits

✅ Massive token savings: Process 100 files with 1K tokens instead of 100K ✅ Faster operations: Local execution vs multiple API round-trips ✅ Stateful workflows: Resume multi-step refactoring across sessions ✅ Auto-secure: PII/secret masking, sandboxed execution

Setup (2 minutes)

# After installing marketplace plugin
~/.claude/plugins/marketplaces/mhattingpete-claude-skills/execution-runtime/setup.sh

When It Activates

Skills automatically use execution mode for:

  • Bulk operations (10+ files)
  • Complex multi-step workflows
  • Iterative processing
  • Codebase-wide analysis

Example: "Rename getUserData to fetchUserData in all Python files"

  • Without execution: ~25,000 tokens (read/edit 50 files)
  • With execution: ~600 tokens (script + summary) - 97.6% savings

Full documentation →

Installation

Install from Marketplace

# In Claude Code - installs the entire plugin with all skills and agents
/plugin marketplace add mhattingpete/claude-skills-marketplace

This installs the engineering-workflow-plugin which includes all skills and the plan-implementer agent.

To install individual plugins:

# Install only engineering workflows
/plugin marketplace add mhattingpete/claude-skills-marketplace/engineering-workflow-plugin

# Install only visual documentation
/plugin marketplace add mhattingpete/claude-skills-marketplace/visual-documentation-plugin

# Install only productivity skills
/plugin marketplace add mhattingpete/claude-skills-marketplace/productivity-skills-plugin

# Install only code operations
/plugin marketplace add mhattingpete/claude-skills-marketplace/code-operations-plugin

Available Plugins

Engineering Workflow Plugin

Skills for common software engineering workflows including git operations, test fixing, code review implementation, and feature planning.

View Plugin Documentation →

Visual Documentation Plugin

Skills for creating stunning visual HTML documentation with modern UI design, SVG diagrams, flowcharts, dashboards, timelines, and comprehensive project architecture diagrams.

View Plugin Documentation →

Productivity Skills Plugin

Productivity and workflow optimization skills for analyzing usage patterns, auditing code quality, bootstrapping projects, and generating comprehensive documentation.

View Plugin Documentation →

Code Operations Plugin

High-precision code manipulation operations including line-based insertion, bulk refactoring, and file analysis. Converted from code-copy-mcp to native Claude Code skills.

Before you install

  • Read the whole file first. Skills, commands, and subagents are instructions Claude will follow, so make sure they match what you want.
  • Check which tools, scripts, or MCP servers it uses. Local servers and scripts run with your permissions.
  • Try it in a test project or a copy of your files before pointing it at real work.
  • Pin the version you tested, and review changes before updating.
  • Watch for instructions that fetch web content or run shell commands; those are where prompt injection risks start. See our prompt injection guide.

FAQ

What is Architecture Diagram Creator?

Architecture Diagram Creator is a skill for Claude Code and Claude Cowork from the mhattingpete/claude-skills-marketplace repository on GitHub. Creates comprehensive HTML architecture diagrams with SVG visualizations showing business context, data flows, processing pipelines, and…

How do I install Architecture Diagram Creator in Claude Code?

Download the architecture-diagram-creator folder from the repository. Save it as ~/.claude/skills/<skill-name>/SKILL.md for all projects, or .claude/skills/<skill-name>/SKILL.md for one project. Claude loads it automatically when a task matches; you can also run it with / and its name.

Can I use Architecture Diagram Creator in Claude Cowork?

Zip the skill folder so SKILL.md sits at the top level of the folder. Open Customize → Skills, click +, then upload the ZIP. Start a task that matches the description, or call it by name with /.

Is Architecture Diagram Creator safe to install?

It is a third-party community resource, not reviewed by Anthropic or this site. Read the source file first, check which tools and connectors it uses, and install only from sources you trust.

Similar resources

Browse all skills, subagents, and plugins →

Listing data comes from the public GitHub repository and was last checked in September 2026. Excerpts are © their authors and shared under Apache-2.0. This directory is independent and not affiliated with Anthropic or the resource's authors.