svg-diagram

SVG diagramming conventions blending a technical look with CJK-friendly typography. Use when creating flowcharts, architecture diagrams, and similar SVG figures. For one-shot generation, prefer invoking it from a subagent so the main context does not have to carry this skill plus the SVG XML; for multi-round tweaking, use it directly in the main context.

Try your first task

Create a small SVG diagram for a document

Start a fresh conversation. Replace the highlighted placeholders.

Use the svg-diagram skill to create a small SVG flowchart or architecture diagram for [DOCUMENT_PATH], based on [COMPONENTS_OR_STEPS]. Save the SVG in an assets/ directory next to the document, add a relative Markdown image reference, and check the first draft for spacing, alignment, overlaps, and viewBox clipping before presenting it.

Required inputs

[DOCUMENT_PATH]: path to the Markdown document, such as docs/foo.md
[COMPONENTS_OR_STEPS]: the components, relationships, or process steps the diagram should show

Suggested template by Skill Leaderboard, grounded in the linked source. Task evidence ↗

Inside SKILL.md

586 lines

Section content has not been verified for this skill yet.

Full source remains withheld under the current source-display policy. Read the author’s source ↗