figure-spec

Render FigureSpec JSON into deterministic publication-quality SVG diagrams.

Updated May 29, 2026
One-click install
npx skills add https://github.com/Mang30/myskills --skill figure-spec-mang30
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: figure-spec
Source: https://github.com/Mang30/myskills/tree/main/skills/figure-spec
Command: npx skills add https://github.com/Mang30/myskills --skill figure-spec-mang30

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

This Skill solves the pain of producing formal, publication-ready architecture and workflow diagrams that look consistent and remain precisely editable after generation.

Core Features & Use Cases

  • Deterministic JSON → SVG rendering: identical FigureSpec inputs produce consistent SVG outputs for reliable iteration.
  • Publication-quality, editable vector figures: outputs are plain-text SVGs that you can tweak later.
  • Structured-diagram coverage: supports architecture, workflows/pipelines, audit cascades, and topology diagrams with shape-aware edges and CJK-friendly labels.
  • Local-only execution: generates figures without network calls or external APIs.

Quick Start

Ask the assistant to generate a FigureSpec JSON for your architecture/workflow diagram, then render it to an editable SVG using the local renderer.

Frequently Asked Questions about figure-spec

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate consistent SVG architecture diagrams from JSON?

To generate deterministic SVG architecture diagrams, you provide a validated FigureSpec JSON input to the local renderer script. Identical JSON inputs produce consistent vector outputs, ensuring reliable iteration for structured visual communication.

Can I render workflow pipelines and topology diagrams locally without external APIs?

Yes, you can render workflow pipelines and topology diagrams using local-only execution. The renderer script generates publication-quality SVG figures from FigureSpec JSON without requiring network calls or external APIs.

What is the best way to create editable SVG diagrams for publication?

The best way to create editable SVG diagrams for publication is rendering them from structured FigureSpec JSON. This process outputs plain-text SVG files that remain precisely editable and maintain visual consistency across iterations.

Does the SVG diagram generation support multilingual labels like CJK characters?

Yes, the SVG diagram generation supports multilingual label handling, including CJK-friendly text. It accommodates architecture layering, audit cascades, and hub-and-spoke diagrams with shape-aware edges while rendering these labels correctly.

Why do my generated SVG diagrams look inconsistent across iterations?

Generated SVG diagrams look inconsistent if the input fails schema validation compliance. Deterministic rendering requires validated FigureSpec JSON; any structural deviation bypasses the deterministic output rules and causes inconsistent figure generation.