ScriptsJul 18, 2026·3 min read

Fireworks Tech Graph — Generate Technical Diagrams from Natural Language

An AI skill that produces SVG and PNG technical diagrams from plain text descriptions. Supports 7 visual styles, UML diagrams, and AI/Agent workflow patterns with clean, production-ready output.

Agent ready

Ready-to-run agent install

This asset can be installed after the agent chooses its runtime, checks the plan, and runs the matching command.

Native · 98/100Policy: allow
Agent surface
Any MCP/CLI agent
Kind
Skill
Install
Single
Trust
Trust: Established
Entrypoint
Fireworks Tech Graph Guide
Direct install command
npx -y tokrepo@latest install 83bba1fd-82c6-11f1-9bc6-00163e2b0d79 --target codex

Run after dry-run confirms the install plan.

Introduction

Fireworks Tech Graph converts plain-text descriptions of systems and workflows into clean technical diagrams. You describe the architecture in natural language and receive production-ready SVG or PNG output, removing the need to manually position boxes and arrows in a GUI diagramming tool.

What Fireworks Tech Graph Does

  • Parses natural language descriptions and produces technical diagrams in SVG or PNG format
  • Supports 7 visual styles: minimal, blueprint, whiteboard, dark, corporate, sketch, and neon
  • Generates UML diagram types including sequence, class, component, and activity diagrams
  • Renders AI/agent workflow patterns with specialized shapes for models, tools, and decision points
  • Accepts iterative refinement commands to adjust layout and labels without regenerating

Architecture Overview

The tool uses a two-stage pipeline. The first stage parses natural language to extract entities and relationships into a structured graph. The second stage applies the selected visual style and computes node positions using force-directed or hierarchical layout. SVG is generated directly; PNG goes through a headless renderer.

Self-Hosting & Configuration

  • Install via pip install fireworks-tech-graph or use the Docker image
  • Configure default style and output format in ~/.fireworks-graph/config.yml
  • Set FTG_OUTPUT_DIR to control where diagrams are saved
  • Custom color palettes defined in YAML can be referenced by name with --style
  • Integrates with CI pipelines to auto-generate diagrams from description files

Key Features

  • Produces clean, deterministic SVG suitable for version control alongside code
  • Seven visual styles match output to different team and presentation contexts
  • Specialized AI/agent workflow support including tool-call loops and multi-agent topologies
  • Iterative refinement adjusts individual elements without full regeneration
  • CLI-first design makes it scriptable for documentation automation

Comparison with Similar Tools

  • Mermaid — requires learning a text-based DSL; Fireworks Tech Graph accepts plain natural language
  • PlantUML — established UML tool with its own markup; Fireworks Tech Graph removes the need for a formal syntax
  • D2 — declarative diagram scripting; Fireworks Tech Graph targets users who prefer English prose descriptions
  • Excalidraw — freehand whiteboard tool; Fireworks Tech Graph automates layout from text input

FAQ

Q: Does the tool require an internet connection? A: The layout engine and style rendering work offline. The natural language parsing stage may use a local or remote LLM depending on your configuration.

Q: How does it handle large diagrams with many nodes? A: The layout engine switches to a hierarchical algorithm for graphs above 30 nodes and supports pagination for very large diagrams.

Q: Can I export the intermediate graph for use in other tools? A: Yes. Pass --export-json to output the parsed graph structure as JSON for programmatic use.

Sources

Discussion

Sign in to join the discussion.
No comments yet. Be the first to share your thoughts.

Related Assets