What problem does it solve? LLMs reliably produce diagram source code but rarely produce diagrams that actually look good without seeing the rendered output. This Skill closes that gap with a generate → render → view PNG → critique → iterate loop, so flowcharts, matrices, and architecture diagrams come out readable instead of tall, clipped, or illegible. ## Core Features & Use Cases - Tool selection by data shape: Picks the right renderer for the data — Mermaid for flows and quadrant charts, D2 for grids and matrices, Graphviz for dependency graphs, raw SVG for precise custom layouts. - Render-and-review loop: Renders source to PNG at a fixed 1200×800 viewport, scores it against a rubric (aspect ratio, text clipping, legibility, colour contrast, overlaps), and iterates up to 3 times before switching tools. - Dark-theme and mkdocs fixes: Built-in rules for dark-theme Mermaid rendering, classDef colour palettes with verified contrast, and known workarounds for broken C4 layout, subgraph styling, and invisible edge labels. - Use Case: A user asks to visualize a buyer-segmentation table. Instead of defaulting to a tall flowchart TD, the Skill switches to D2 with grid-columns: 3, renders at 1200×900, colour-codes by priority, and delivers a readable matrix. ## Quick Start Ask the assistant to create a flowchart or architecture diagram of your system and have it render and review the output until it is readable.
