Diagram Design

Name: Diagram Design
Availability: InStock
Author: cathrynlavery

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), l

High Quality

New

Join 0+ developers using this skill

skill

Creative & Media

intermediate

0 installs

4/5 quality

View Source

Last updated: October 22, 2026

AI Skill Market Insights

Real data. Real impact.

Popularity

Rising

Emerging

Active Users

Developers

Quick Start

Install Command

npx skills add cathrynlavery/diagram-design --skill diagram-design

TEAR & SHARE

3-5hrs/WK

RISING

0.0K+ USING

Diagram Design

Create diagrams as self-contained HTML files with inline SVG and an editorial design system.

Forty-five visual types. Semantic patterns describe behavior; type references describe layout.

0. First-time setup — style guide gate

Before generating your first diagram in a new project, verify the style guide has been customized.

Do not silently ship default-skinned diagrams into a branded project.

First resolve any project

.diagram-design

marker per

references/profiles.md

; a successfully resolved marker selects its profile and

Install

npx skills add cathrynlavery/diagram-design --skill diagram-design

Or copy the skill folder manually:

git clone https://github.com/cathrynlavery/diagram-design.git
cp -r diagram-design/skills/diagram-design/ ~/.claude/skills/diagram-design

Source: cathrynlavery/diagram-design — 59,798 stars, MIT, verified 2026-10-22.

Diagram Design

AI Skill Market Insights

Quick Start

Install Command

TEAR & SHARE

Tags

Chart MCP Server

Be Part of the 0+ Developer Community

Diagram Design

0. First-time setup — style guide gate

License

Heddy IP — Brand Illustration

KiCad MCP Server

Shadcn UI MCP Server

Douyin MCP Server

Channels

Learn

Compare

Company

Agents