← All skills
fireworks-tech-graph
82 / 100 · Low risk
Fine to try. Some of what it can do is expected: a coding skill usually runs build and test commands.
By boshi-xixixi/TraeSkill (GitHub) · coding · 283 stars · scanned at commit 9cf38e6
Use when the user wants to create any technical diagram - architecture, data flow, flowchart, sequence, agent/memory, or concept map - and export as SVG+PNG. Trigger on: "画图" "帮我画" "生成图" "做个图" "架构图" "流程图" "可视化一下" "出图" "generate diagram" "draw diagram" "visualize" or any system/flow description the user wants illustrated.
Works with any agent that supports SKILL.md skills.
What this skill can do
Downloads and installs other software
The author does not mention this.
Found in 29 places.
Show 17 more
- .trae/Skills/.agents/skills/fireworks-tech-graph/README.md, line 189
brew install librsvg # macOS - .trae/Skills/.agents/skills/fireworks-tech-graph/README.md, line 190
sudo apt install librsvg2-bin # Ubuntu/Debian - .trae/Skills/.agents/skills/fireworks-tech-graph/README.md, line 202
| **cairosvg** | ✅ Good | Single `pip install` | Default — best balance | - .trae/Skills/.agents/skills/fireworks-tech-graph/README.md, line 544
| PNG not generated | No renderer installed | `pip install cairosvg` (recommended), or `brew install librsvg` / `apt install librsvg2-bin` | - .trae/Skills/.agents/skills/fireworks-tech-graph/README.md, line 545
| Borders or text missing in PNG | Using `rsvg-convert` on SVG with CSS / `<foreignObject>` | Switch to `cairosvg` (`pip install cairosvg`) — much better CSS su - .trae/Skills/.agents/skills/fireworks-tech-graph/README.zh.md, line 139
npx skills add yizhiyanhua-ai/fireworks-tech-graph - .trae/Skills/.agents/skills/fireworks-tech-graph/README.zh.md, line 153
npx skills add yizhiyanhua-ai/fireworks-tech-graph --force -g -y - .trae/Skills/.agents/skills/fireworks-tech-graph/README.zh.md, line 172
pip install cairosvg - .trae/Skills/.agents/skills/fireworks-tech-graph/README.zh.md, line 175
brew install librsvg # macOS - .trae/Skills/.agents/skills/fireworks-tech-graph/README.zh.md, line 176
sudo apt install librsvg2-bin # Ubuntu/Debian - .trae/Skills/.agents/skills/fireworks-tech-graph/README.zh.md, line 188
| **cairosvg** | ✅ 好 | 一行 `pip install` | 默认推荐,平衡最佳 | - .trae/Skills/.agents/skills/fireworks-tech-graph/README_GITHUB.md, line 24
npx skills add yizhiyanhua-ai/fireworks-tech-graph - .trae/Skills/.agents/skills/fireworks-tech-graph/SKILL.md, line 20
npx skills add yizhiyanhua-ai/fireworks-tech-graph - .trae/Skills/.agents/skills/fireworks-tech-graph/SKILL.md, line 34
npx skills add yizhiyanhua-ai/fireworks-tech-graph --force -g -y - .trae/Skills/.agents/skills/fireworks-tech-graph/SKILL.md, line 454
| **`cairosvg` (recommended)** | `pip install cairosvg` | ✅ Good | Solid CSS support; clearly better than rsvg-convert | - .trae/Skills/.agents/skills/fireworks-tech-graph/scripts/README.md, line 129
pip install cairosvg - .trae/Skills/.agents/skills/fireworks-tech-graph/scripts/README.md, line 134
brew install librsvg # macOS
and 9 more places
Runs commands on your computer
This is disclosed by the author in the skill's SKILL.md or README. Expected for a coding skill.
Found in 10 places.
Show 7 more
- .trae/Skills/.agents/skills/fireworks-tech-graph/SKILL.md, line 51
python3 ./scripts/generate-from-template.py architecture ./output/arch.svg '{"title":"My Diagram","nodes":[],"arrows":[]}' - .trae/Skills/.agents/skills/fireworks-tech-graph/SKILL.md, line 59
./scripts/validate-svg.sh <svg-file> - .trae/Skills/.agents/skills/fireworks-tech-graph/SKILL.md, line 69
./scripts/test-all-styles.sh - .trae/Skills/.agents/skills/fireworks-tech-graph/SKILL.md, line 422
python3 -c "import xml.etree.ElementTree as ET; ET.parse('file.svg')" && echo "✓ Valid XML" - .trae/Skills/.agents/skills/fireworks-tech-graph/SKILL.md, line 461
python3 -c "import cairosvg; cairosvg.svg2png(url='input.svg', write_to='output.png', scale=2)" - .trae/Skills/.agents/skills/fireworks-tech-graph/SKILL.md, line 480
rsvg-convert -w 1920 file.svg -o file.png - .trae/Skills/.agents/skills/fireworks-tech-graph/SKILL.md, line 492
npm install puppeteer # auto-downloads Chromium
Install
Paste this into your terminal. It downloads exactly the version we scanned, not whatever is newest.
if [ -e ~/.agents/skills/'fireworks-tech-graph' ] || [ -L ~/.agents/skills/'fireworks-tech-graph' ]; then echo 'A skill folder named fireworks-tech-graph already exists — not replacing it' >&2; false; else d=$(mktemp -d) && git clone --quiet --filter=blob:none --no-checkout 'https://github.com/boshi-xixixi/TraeSkill' "$d" && git -C "$d" checkout --quiet '9cf38e632bdfb9d91a965140ffcbdac8e45659b1' -- '.trae/Skills/.agents/skills/fireworks-tech-graph' && mkdir -p ~/.agents/skills && cp -R "$d"/'.trae/Skills/.agents/skills/fireworks-tech-graph' ~/.agents/skills/'fireworks-tech-graph' && rm -rf "$d"; fi
Codex reads ~/.agents/skills directly. For Claude Code, Cursor, Copilot, Gemini CLI, Antigravity or OpenCode, also link it. For Claude Code: ln -s ~/.agents/skills/'fireworks-tech-graph' ~/.claude/skills/'fireworks-tech-graph' (other agents: ~/.cursor/skills, ~/.copilot/skills, ~/.gemini/skills, ~/.gemini/config/skills, ~/.config/opencode/skills). Or install through the finder skill, which does both.
Badge for your README
The badge for boshi-xixixi/TraeSkill shows the score of its lowest-scoring skill.

[](https://zalavijaysinh.github.io/skilltrust/repos/boshi-xixixi/TraeSkill/)
Score history
| Date | Version | Score |
|---|
| 2026-11-12 | 9cf38e6 | 82 |