Diagram Design

Cathryn Lavery's diagram-design is a strong reference implementation for editorial, brand-aware diagrams; adopt its quality rules now and trial the package only after overlap and compatibility checks.

The MIT-licensed repository describes a self-contained HTML and inline-SVG workflow with multiple diagram families, light/dark/editorial styles, brand onboarding, accessible contrast, and SVG/PNG export. Its most useful design rules are subtractive: every node must earn its place, density should stay controlled, accent color should identify only one or two focal points, and brand skin should replace generic rounded-box sameness. Source: cathrynlavery/diagram-design, reviewed 2026-07-15

Local Fit

The repository overlaps with Security and Review Skills and Media Generation Skills. The local create-graphics skill should route editable whiteboards to Excalidraw and pixel-precise/selectable-text graphics to HTML/SVG while borrowing Diagram Design's deletion, density, accent, and brand-onboarding discipline.

Install Decision

CANDIDATE_TRIAL_OVERLAP_REVIEW. Do not add it to every runtime yet. A trial must prove a distinct diagram family or a materially better export/brand workflow, validate the source and dependencies, and define which local capability it supersedes or complements.

Current evidence keeps that decision intact: the MIT source is at da45d4a79a76dc0742c8554b7eabe551db100701, with 6,612 stars, one skill, and no detected tests or CI workflows. The source is useful and reputable; its examples do not replace semantic-content review, responsive/accessibility proof, editable export checks, or overlap evaluation against Kevin's existing diagram routes. Source: commit-pinned repository receipt, 2026-08-12


Timeline