Agent Plugins Marketplace
← All plugins

diagram-design

v2.6.91

Architecture, architecture delta, IT current-state, flowchart, sequence, state machine, ER/data model, timeline, swimlane, quadrant, radar/spider, polar, loop, nested, tree, org chart, layer stack, exploded/plan, Venn, pyramid/funnel, bar, waterfall, treemap, heatmap, line, Gantt, scatter, high-level, process, medallion, data flow, DP integration, DP security matrix, Sankey, fishbone, Wardley map, kanban, journey, deployment, dependency, blueprint, UML class, story map, schema, lifecycle phase.

CodexClaude Code1 Skill

By Cathryn LaveryLicense: MIT53.1k GitHub starsUpdated last week

Directory evidence

Runtimes
Codex and Claude Code
Parsed components
1 skill or MCP entry
Source updated
Oct 13, 2026
Manifest status
Canonical path parsed

The directory validates manifest shape and source location. It does not execute the plugin or provide a security endorsement. Review the indexing methodology →

Install diagram-design for Codex and Claude Code

Installs for the current user
codex plugin marketplace add cathrynlavery/diagram-design
codex plugin marketplace upgrade diagram-design
codex plugin add diagram-design@diagram-design

Paste and run these commands in a terminal with Codex. They add and refresh the diagram-design catalog, then install this plugin.

Compatibility: the page URL and API slug “diagram-design” remain stable.

  • Codex: diagram-design@agent-plugin-marketplace → diagram-design@diagram-design

The installer fetches third-party code from the source repository shown on this page. This directory validates manifest structure and source location, but does not perform a security audit; review the manifest, components, and source before installing.

Get the source manually
git clone https://github.com/cathrynlavery/diagram-design

Clone the source repository, then follow its setup instructions to add the plugin to a compatible client. The repository root is the plugin root.

Plugin files

diagram-design/
├── .codex-plugin/plugin.json
├── .claude-plugin/plugin.json
└── skills/diagram-design/SKILL.md

Included Skills1

diagram-designskills/diagram-design/SKILL.md

Create branded architecture, architecture delta, IT current-state, flowchart, sequence, state machine, ER/data model, timeline, swimlane, quadrant, radar/spider, polar chart (polar/radial lollipop), loop/flywheel, nested, tree, org chart, layer stack, exploded axonometric, axonometric plan, Venn, pyramid/funnel, treemap and marimekko, heatmap, bar and dumbbell, waterfall, line (slopegraph, ridgeline, streamgraph, bump), Gantt and scatter charts (bubble, beeswarm), high-level, process, medallion, data flow, DP integration, DP security matrix, Sankey, fishbone, Wardley map, kanban, user journey, service blueprint, deployment, dependency graph, UML class, story map, or database schema diagrams as HTML/SVG/PNG, with .drawio, Mermaid, and .excalidraw import, plus lifecycle phase maps, block decomposition trees, and onboarding guidance.

Plugin manifests2

.codex-plugin/plugin.json
{
  "name": "diagram-design",
  "description": "Architecture, architecture delta, IT current-state, flowchart, sequence, state machine, ER/data model, timeline, swimlane, quadrant, radar/spider, polar, loop, nested, tree, org chart, layer stack, exploded/plan, Venn, pyramid/funnel, bar, waterfall, treemap, heatmap, line, Gantt, scatter, high-level, process, medallion, data flow, DP integration, DP security matrix, Sankey, fishbone, Wardley map, kanban, journey, deployment, dependency, blueprint, UML class, story map, schema, lifecycle phase.",
  "version": "2.6.91",
  "author": {
    "name": "Cathryn Lavery",
    "url": "https://github.com/cathrynlavery"
  },
  "homepage": "https://diagramdesign.dev",
  "repository": "https://github.com/cathrynlavery/diagram-design",
  "license": "MIT",
  "keywords": [
    "diagrams",
    "svg",
    "architecture",
    "flowchart",
    "visualization",
    "editorial",
    "drawio",
    "mermaid",
    "import",
    "animation",
    "semantic-patterns"
  ],
  "skills": "./skills/",
  "interface": {
    "displayName": "Diagram Design",
    "shortDescription": "Create editorial diagrams",
    "longDescription": "Diagram Design turns a description of your system, process, or data into an editorial diagram that matches your brand. Editorial diagrams your designer won't hate. No Figma. No generic rounded boxes. No 30-minute color-picking sessions.\n\nDescribe what you need and get a self-contained HTML file with inline SVG that opens in any browser and exports to SVG or PNG. Point it at your website once and it reads your colors and fonts, so every diagram looks like the rest of your site. It also redraws draw.io, Mermaid, and Excalidraw files at the size and level of detail you choose.\n\nEvery node earns its place. The accent color is reserved for the one or two things the reader should look at first.\n\n45 diagram types: architecture, architecture delta, IT current-state, flowchart, sequence, state machine, ER/data model, timeline, swimlane, quadrant, radar/spider, polar chart (polar/radial lollipop), loop/flywheel, nested, tree, org chart, layer stack, exploded axonometric, axonometric site/floor plan, Venn, pyramid/funnel, treemap and marimekko, heatmap, bar and dumbbell, waterfall, line (slopegraph, ridgeline, streamgraph, bump), Gantt and scatter charts (bubble, beeswarm), high-level, process, medallion, data flow, DP integration, DP security matrix, Sankey, fishbone, Wardley map, kanban, user journey, service blueprint, deployment, dependency graph, UML class, story map, and database schema. Plus lifecycle phase maps, block decomposition trees, semantic patterns, callouts, accessible motion, and sketchy hand-drawn styling.",
    "developerName": "LittleMight",
    "category": "Creativity",
    "capabilities": [
      "Read",
      "Write"
    ],
    "websiteURL": "https://diagramdesign.dev",
    "privacyPolicyURL": "https://github.com/cathrynlavery/diagram-design/blob/main/PRIVACY.md",
    "defaultPrompt": [
      "Make an architecture diagram of my app.",
      "Create a flowchart for this decision process.",
      "Redraw this Mermaid diagram at the right size and detail level."
    ],
    "brandColor": "#b5523a",
    "logo": "./assets/logo.png",
    "composerIcon": "./assets/composer-icon.png"
  }
}
.claude-plugin/plugin.json
{
  "name": "diagram-design",
  "description": "Architecture, architecture delta, IT current-state, flowchart, sequence, state machine, ER/data model, timeline, swimlane, quadrant, radar/spider, polar, loop, nested, tree, org chart, layer stack, exploded/plan, Venn, pyramid/funnel, bar, waterfall, treemap, heatmap, line, Gantt, scatter, high-level, process, medallion, data flow, DP integration, DP security matrix, Sankey, fishbone, Wardley map, kanban, journey, deployment, dependency, blueprint, UML class, story map, schema, lifecycle phase.",
  "version": "2.6.91",
  "author": {
    "name": "Cathryn Lavery",
    "url": "https://github.com/cathrynlavery"
  },
  "homepage": "https://diagramdesign.dev",
  "repository": "https://github.com/cathrynlavery/diagram-design",
  "license": "MIT",
  "keywords": [
    "diagrams",
    "svg",
    "architecture",
    "flowchart",
    "visualization",
    "editorial",
    "drawio",
    "mermaid",
    "import",
    "animation",
    "semantic-patterns"
  ]
}

If you maintain this plugin, link to this source-backed listing from your README so users can review its manifest and indexed components.

[diagram-design on Agent Plugins Marketplace](https://pluginsmp.com/plugins/diagram-design)