# Diagram

> Create self-contained HTML diagrams of systems, architectures, workflows, and code relationships. Use when the user asks for a diagram, an architecture picture, or a workflow visualization, or wants to communicate a design visually.

- **Type:** Skill
- **Install:** `agentstack add skill-akshay-diwadkar-skills-diagram`
- **Verified:** Yes — security-reviewed for prompt injection and unsafe behavior
- **Seller:** [akshay-diwadkar](https://agentstack.voostack.com/s/akshay-diwadkar)
- **Installs:** 0
- **Category:** [Developer Tools](https://agentstack.voostack.com/c/developer-tools)
- **Latest version:** 0.1.0
- **License:** MIT
- **Upstream author:** [akshay-diwadkar](https://github.com/akshay-diwadkar)
- **Source:** https://github.com/akshay-diwadkar/skills/tree/main/skills/engineering/diagram

## Install

```sh
agentstack add skill-akshay-diwadkar-skills-diagram
```

Requires the [AgentStack CLI](https://agentstack.voostack.com/docs/cli). Works with Claude Code, Cursor, and any MCP-compatible agent.

## About

# Diagram

## Purpose and authority

Ground a shared model, obtain approval, then build one self-contained HTML
diagram with the bundled template. Default to `narrative-architecture`.
Minimum payload: title, fidelity, nodes, labeled edges, and agent metadata.
Use `exact-code-graph` only for code-symbol review and
`executive-concept-map` only for business ownership and outcomes.

Do not create, overwrite, save, or verify diagram files in conversational Plan
Mode. Model approval, directory creation, overwrite permission, and execution
authority are separate decisions. Never hand-code an alternate renderer for
normal output.

## Start

After approval and outside Plan Mode, use absolute paths:

```bash
python /absolute/skill-root/scripts/cli.py --repo-root /absolute/repo \
  --input fidelity=narrative-architecture --input data=/absolute/payload.json \
  --input output=/absolute/diagram.html --input create_dirs=no \
  --input overwrite=no --format json run
```

Run each returned `next_command.argv` with its returned `cwd`. Read only
`required_reads`, write only `allowed_writes`, and stop on every
`blocking_reason`. Never change `create_dirs` or `overwrite` to `yes` without
the matching user permission.

## Next-step loop

Inspect repository evidence before asking questions. Follow the phased
[Diagram Output Guide](references/diagram-output-guide.md) until purpose, audience,
fidelity, entities, relationships, omissions, evidence policy, output path, and
verification are confirmed. Emit one approved plan before creating files.

Build the approved `diagram` and `metadata` payload using the taxonomy and
shape in [Diagram Output Guide](references/diagram-output-guide.md). Obtain explicit
permission for a missing directory or existing target, then run each returned
command until validation reaches phase `complete`.

## Completion and recovery

Complete only at phase `complete`, after `validate_diagram.py` passes and the
browser checks in the output guide confirm readability, labels, legend,
walkthrough, details, drag, pan, zoom, theme, and reset behavior.

Repair validator errors before opening the output. Review non-blocking warnings.
If permission, fidelity, or the approved model changes, return to planning and
regenerate the payload; do not patch generated HTML around the builder.

## Source & license

This open-source skill is cataloged on AgentStack and links to its original source — we do not rehost the code.

- **Author:** [akshay-diwadkar](https://github.com/akshay-diwadkar)
- **Source:** [akshay-diwadkar/skills](https://github.com/akshay-diwadkar/skills)
- **License:** MIT

Install and usage instructions live in the source repository linked above.

## Pricing

- **Free** — Free

## Security capabilities

Automated source analysis of v0.1.0 — what this tool can access:

- **Network access:** no
- **Filesystem access:** no
- **Shell / process execution:** no
- **Environment & secrets:** no
- **Dynamic code execution:** no

*"Yes" means the capability is present in the source — more access means more to trust, not that it is unsafe.*


## Versions

- **0.1.0** — security scan: passed — Imported from the upstream source.

## Links

- Listing page: https://agentstack.voostack.com/l/skill-akshay-diwadkar-skills-diagram
- Seller: https://agentstack.voostack.com/s/akshay-diwadkar
- Browse the marketplace: https://agentstack.voostack.com/browse

---
Listed on AgentStack — the marketplace for AI agent skills and MCP servers. Every listing is security-reviewed. Creators keep 70%.