SKILL

diagram-design

Create polished, accessible, self-contained HTML/SVG diagrams for architecture, deployment, dependency graphs, workflows, data flows, Sankey flows, sequences, state machines and lifecycle maps, ER and database schemas, UML class, timelines, swimlanes, user journeys, story maps, kanban, Wardley maps, fishbone, charts (bar, waterfall, line, heatmap, treemap, scatter, polar), security views, and other editorial visual types. Redraw Mermaid, draw.io, and Excalidraw sources into a fresh layout, apply optional brand tokens or saved client profiles, add accessible explanatory motion, and verify geometry, accessibility, motion, and single-file safety. Use when the output should be an editable HTML/SVG artifact rather than an ASCII sketch, generated raster image, or editable whiteboard canvas.

Target: Design & content creation. Automatically collected · unverified.

Use with Codex

A guide for this combination is not available yet, and compatibility has not been verified.

Requirements

  • Only the author’s Skill metadata is included. Read the full instructions to check dependencies, licensing and conditions of use.

Choose an AI tool with documented instructions, or save the resource and request a guide after the page loads.

Read the author’s documentation ↗