Create professional diagrams using Mermaid or DOT/Graphviz. Mermaid for flowcharts, sequences, classes, ER, Gantt, architecture with semantic coloring and WCAG AA accessibility. DOT/Graphviz for pure network graphs, semantic webs, and maximum layout control.
Install
npx skills add sparkling/claude-config --skill diagrammingnpx skills add sparkling/claude-config --skill diagramming -a claude-code -gnpx skills add sparkling/claude-config --skill diagramming -a codex -ggemini skills install https://github.com/sparkling/claude-config.git --path skills/diagramminggh skill install sparkling/claude-config diagramminggit clone --depth 1 https://github.com/sparkling/claude-config /tmp/sparkling__claude-config
mkdir -p ~/.claude/skills ~/.agents/skills
cp -R /tmp/sparkling__claude-config/skills/diagramming ~/.claude/skills/diagramming # Claude Code
cp -R /tmp/sparkling__claude-config/skills/diagramming ~/.agents/skills/diagramming # Codex, Cursor, Gemini CLI, Copilot, OpenCode