
Fireworks Tech Graph
Creates precise SVG technical diagrams and exports PNG, HTML, or animated GIF.
Install
npx skills add yizhiyanhua-ai/fireworks-tech-graph --skill fireworks-tech-graph -g -a claude-code -y- Repository
- yizhiyanhua-ai/fireworks-tech-graph11.9k
- Category
- Design
- Updated
- 14d ago
- License
- MIT
- Context cost
- Lightabout 1,333 tokens
- Runs scripts
- No, instructions only
What it does
Create precise SVG technical diagrams, export PNG or offline HTML, and animate supported semantic SVGs to GIF. Use for architecture, UML, agent, cloud or workflow diagrams; not photos, raster art or statistical charts.
Fireworks Tech Graph
One portable Agent Skill for Codex and Claude Code. SVG is the canonical artifact; PNG, offline HTML and supported GIF motion are output routes. Preserve requested labels, topology and meaning; a successful command is not a visual quality verdict.
Locate and select
Resolve the directory containing this file as SKILL_ROOT. Use
${CLAUDE_SKILL_DIR} in Claude Code or the absolute directory in Codex's loaded
skill metadata. Do not assume cwd or a previous shell variable persists.
Use the installed version for the task. Run version for source/version questions
and doctor when diagnosing a missing renderer, font or dependency; do not make
installation, updates or a complete test suite prerequisites for every diagram.
SKILL_ROOT="${CLAUDE_SKILL_DIR:-/absolute/path/from-codex-skill-metadata}"
python3 "$SKILL_ROOT/scripts/fireworks.py" version
- Honor the user's diagram type, content and style; choose sensible reversible details from the brief. Ask only for a material missing engineering fact or a choice the user explicitly reserved. A request to draw includes local rendering.
- Styles 1, 7 and 9, 12 have JSON generators. Style 8 (Dark Luxury) remains AI-authored SVG: use its style reference, then the same validation/export gates.
- Default to Style 1 Flat Icon when no user/workspace preference applies. Load the actual matching file from the style matrix. Read other styles only for a requested comparison.
- Styles 9, 12 default to C4, cloud, event and observability semantic contracts. Validate facts before layout; do not invent responsibilities, protocols or metrics.
- Adapt an existing valid SVG directly when appropriate. JSON generation is not required for every edit. Use diagram/layout guidance and icons only for the relevant type or symbols.


