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.