stack-diagram

74 / 100 · Review before installing

Check before installing. Some of what it can do is expected: a coding skill usually runs build and test commands.

By caru-ini/stack-diagram (GitHub) · coding · 2,232 stars · scanned at commit 5af3b09

Create cloud-architecture-style diagrams of tech stacks, system architectures, infra layouts, and service topologies — with real brand logos, grouped containers, and clean orthogonal arrows — delivered as self-contained HTML, a PNG image, a React/TSX component, or a live artifact. Use this skill whenever the user asks for an architecture / system / stack / infra diagram, a tech-stack overview, a service topology, a cloud-vendor-style diagram, or wants tech logos arranged into a picture of how t…

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 3 places.

skills/stack-diagram/SKILL.md, line 16- Playwright + Chromium for `render_png.py`: `pip install playwright && python3 -m playwright install --with-deps chromium`
skills/stack-diagram/scripts/render_png.py, line 16pip install playwright
skills/stack-diagram/scripts/render_png.py, line 53"variants. Install a Japanese font, e.g. on Debian/Ubuntu: sudo apt-get install fonts-noto-cjk\n"

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 5 places.

skills/stack-diagram/SKILL.md, line 44python3 scripts/fetch_icons.py <icons-dir> tanstack hono drizzle "betterauth:better-auth" "orpc=https://orpc.unnoq.com/logo.webp"
skills/stack-diagram/SKILL.md, line 79python3 scripts/build.py my-diagram.html <icons-dir> out.html --fonts <skill>/assets/fonts
skills/stack-diagram/SKILL.md, line 89python3 scripts/render_png.py out.html check.png --selector .canvas --scale 2

Show 2 more

skills/stack-diagram/SKILL.md, line 131python3 scripts/share.py submit out.png out-dark.png --title "..." --stack "..." --name "..." [--github LOGIN] [--icons DIR]
skills/stack-diagram/scripts/render_png.py, line 50ja = subprocess.run(["fc-list", ":lang=ja"], capture_output=True, text=True).stdout

Connects to the internet

This is disclosed by the author in the skill's SKILL.md or README.

Found in 10 places.

skills/stack-diagram/scripts/fetch_icons.py, line 39import base64, functools, http.client, io, json, pathlib, re, sys, urllib.request, urllib.error, urllib.parse, zipfile
skills/stack-diagram/scripts/fetch_icons.py, line 150req = urllib.request.Request(url, headers=UA)
skills/stack-diagram/scripts/fetch_icons.py, line 151with urllib.request.urlopen(req, timeout=timeout) as r:

Show 7 more

skills/stack-diagram/scripts/fetch_icons.py, line 237except (OSError, zipfile.BadZipFile, http.client.HTTPException) as e:
skills/stack-diagram/scripts/fetch_icons.py, line 264except (OSError, zipfile.BadZipFile, http.client.HTTPException) as e:
skills/stack-diagram/scripts/fetch_icons.py, line 293except (OSError, zipfile.BadZipFile, http.client.HTTPException) as e:
skills/stack-diagram/scripts/share.py, line 24import hashlib, http.client, json, os, pathlib, re, sys, tempfile, time, urllib.error, urllib.parse, urllib.request, uuid
skills/stack-diagram/scripts/share.py, line 39req = urllib.request.Request(GALLERY + path, data=body, method=method, headers={**UA, **(headers or {})})
skills/stack-diagram/scripts/share.py, line 41with urllib.request.urlopen(req, timeout=60) as r:
skills/stack-diagram/scripts/share.py, line 50except (OSError, http.client.HTTPException) as e:

Changes files outside its own folder

This is disclosed by the author in the skill's SKILL.md or README.

Found in 1 place.

skills/stack-diagram/scripts/render_png.py, line 56" mkdir -p ~/.fonts && cp /tmp/fontx/usr/share/fonts/opentype/noto/NotoSansCJK-*.ttc ~/.fonts/ && fc-cache -f")

Safer alternatives

Low-risk skills in the same category (coding) that look related. Check that one does what you need.

Install

Paste this into your terminal. It downloads exactly the version we scanned, not whatever is newest.

if [ -e ~/.agents/skills/'stack-diagram' ] || [ -L ~/.agents/skills/'stack-diagram' ]; then echo 'A skill folder named stack-diagram already exists — not replacing it' >&2; false; else d=$(mktemp -d) && git clone --quiet --filter=blob:none --no-checkout 'https://github.com/caru-ini/stack-diagram' "$d" && git -C "$d" checkout --quiet '5af3b095fff7109c905c5284dc510dc06588bade' -- 'skills/stack-diagram' && mkdir -p ~/.agents/skills && cp -R "$d"/'skills/stack-diagram' ~/.agents/skills/'stack-diagram' && 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/'stack-diagram' ~/.claude/skills/'stack-diagram' (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 caru-ini/stack-diagram shows the score of its lowest-scoring skill.

SkillTrust badge for caru-ini/stack-diagram

[![SkillTrust](https://zalavijaysinh.github.io/skilltrust/badges/caru-ini/stack-diagram.svg)](https://zalavijaysinh.github.io/skilltrust/repos/caru-ini/stack-diagram/)

Score history

Date	Version	Score
2026-11-10	`5af3b09`	74
2026-11-08	`1ed53e3`	74
2026-11-07	`1ed53e3`	74