← Back to Skills Marketplace
86
Downloads
0
Stars
0
Active Installs
3
Versions
Install in OpenClaw
/install svg-architecture-diagram
Description
Create professional, publication-quality technical architecture diagrams using pure SVG in HTML, then screenshot via Playwright. Produces crisp, pixel-perfec...
Usage Guidance
This skill appears coherent and focused on producing SVG diagrams and screenshots. Before running: (1) inspect any HTML you render for external URLs (examples import Google Fonts via https://fonts.googleapis.com), (2) install Playwright and run 'playwright install chromium' — note that installs browser binaries from upstream, and (3) run the included script on local files in a safe directory (it loads file:// paths and writes PNGs locally). If you're running the agent autonomously, be aware Playwright will fetch remote resources referenced by the HTML; otherwise there are no hidden endpoints or credential requests.
Capability Analysis
Type: OpenClaw Skill
Name: svg-architecture-diagram
Version: 1.2.0
The skill bundle is a legitimate utility for generating high-quality architecture diagrams using SVG and Playwright. The Python script `scripts/screenshot.py` performs standard browser automation to render local HTML files into PNG images, and the `SKILL.md` provides clear, task-aligned instructions for the AI agent without any signs of prompt injection, data exfiltration, or malicious intent.
Capability Tags
Capability Assessment
Purpose & Capability
Name/description match delivered artifacts: SVG patterns, example HTMLs, design-system reference and a screenshot helper script. All requested capabilities (rendering SVG and taking high-res screenshots) are justified by the skill's purpose.
Instruction Scope
SKILL.md stays on-topic: it instructs authors to produce an HTML file with inline SVG and to render it locally via Playwright or the bundled script. It does not instruct reading credentials, system-wide config, or exfiltrating data. The only external resource referenced is Google Fonts in the example HTML.
Install Mechanism
There is no install spec (instruction-only + small script). The included Python script uses Playwright and optionally Pillow; the script's ImportError message instructs the user to install them. Playwright will download browser binaries when the user runs 'playwright install chromium' — this is expected and not from an unknown host. No downloads from personal servers or URL-shorteners are present.
Credentials
The skill requests no environment variables or credentials. The script works with local file:// paths and writes a local PNG — this is proportionate to its stated function.
Persistence & Privilege
Skill does not request always:true; it is user-invocable and does not modify other skills or global agent config. It only operates on local files and produces local output.
How to Use
- Make sure OpenClaw is installed (local or Docker)
- Run the install command in chat:
/install svg-architecture-diagram - After installation, invoke the skill by name or use
/svg-architecture-diagram - Provide required inputs per the skill's parameter spec and get structured output
Version History
v1.2.0
连线间距规范(≥20px防箭头吞线), 新增OpenClaw架构图示例, Card Spacing Rules
v1.1.0
默认4x最高清分辨率(6400x4000px)
v1.0.0
纯SVG技术架构图, 精确连线+颜色编码+防溢出, 含Hermes示例
Metadata
Frequently Asked Questions
What is SVG Architecture Diagram?
Create professional, publication-quality technical architecture diagrams using pure SVG in HTML, then screenshot via Playwright. Produces crisp, pixel-perfec... It is an AI Agent Skill for Claude Code / OpenClaw, with 86 downloads so far.
How do I install SVG Architecture Diagram?
Run "/install svg-architecture-diagram" in the OpenClaw or Claude Code chat to install it in one step — no extra setup required.
Is SVG Architecture Diagram free?
Yes, SVG Architecture Diagram is completely free, licensed under MIT-0. You can download, install and use it at no cost.
Which platforms does SVG Architecture Diagram support?
SVG Architecture Diagram is cross-platform and runs anywhere OpenClaw / Claude Code is available (cross-platform).
Who created SVG Architecture Diagram?
It is built and maintained by Garming (@wujiaming88); the current version is v1.2.0.
More Skills