ソース情報
- リポジトリ
- HezaoHezao/poirot
- ソースの最終更新活動
- 2026年7月28日 12:58
- 検出された SKILL.md の言語
- 英語
- スター
- 213
- フォーク
- 15
インストール方法
デフォルトでは、最初にソースを確認する Prompt が選択されています。直接コマンドに切り替えるか、ローカルコピーをダウンロードすることもできます。
ソースファイルを確認
インストールを決める前に、SKILL.md と SkillsMP に表示されている付属ファイルをお読みください。
メニュー
デフォルトでは、最初にソースを確認する Prompt が選択されています。直接コマンドに切り替えるか、ローカルコピーをダウンロードすることもできます。
インストールを決める前に、SKILL.md と SkillsMP に表示されている付属ファイルをお読みください。
SOC 職業分類に基づく
Codex または Claude でインストール この Prompt をコピーして Codex、Claude、または他のアシスタントに貼り付けると、Skill ページを確認してインストールできます。
直接コマンドでは確認用 Prompt が省略されます。実行前にソースを確認してください。
npx skills add https://github.com/HezaoHezao/poirot --skill architecture-diagramコマンドは1行のまま表示されます。コピー前に横へスクロールして全体を確認してください。
ローカルで確認しますか？SkillsMP が現在取得できるファイルをダウンロードできます。
SKILL.md を表示中
| name | architecture-diagram |
| description | Dark-themed SVG architecture/cloud/infra diagrams as HTML. |
| allowed-tools | ["write_file","read_file"] |
| enabled | true |
| related-skills | ["concept-diagrams"] |
| license | MIT |
| author | Adapted from hermes-agent (Nous Research, MIT); Cocoon AI |
Generate professional, dark-themed technical architecture diagrams as standalone HTML files with inline SVG graphics. No external tools, no API keys, no rendering libraries — just write the HTML file and open it in a browser.
Best suited for:
Look elsewhere first for:
concept-diagramsconcept-diagramswrite_file to a .html filewrite_file("architecture.html", "<full HTML with inline SVG + CSS>")
# Default to current working directory
./[project-name]-architecture.html
:root {
--bg: #0a0a1a;
--grid: #1a1a2e;
/* Component types */
--c-frontend: #00D9FF; /* cyan */
--c-backend: #50C878; /* green */
--c-database: #F5A623; /* orange */
--c-external: #C4A7E7; /* purple */
--c-queue: #FF6B6B; /* red */
--c-cache: #FFD700; /* gold */
--text: #E0E0E0;
--text-dim: #888;
--border: #333;
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Architecture Diagram</title>
<style>
body {
margin: 0; padding: 40px;
background: var(--bg);
background-image: radial-gradient(circle, var(--grid) 1px, transparent 1px);
background-size: 30px 30px;
}
svg { display: block; margin: 0 auto; }
.component {
stroke-width: 2; rx: 6; ry: 6;
fill-opacity: 0.1;
}
.label {
font-family: 'SF Mono', 'Fira Code', monospace;
font-size: 13px; fill: var(--text);
}
.label-type {
font-size: 10px; fill: var(--text-dim);
: uppercase; : ;
}
{
: (--text-dim); : ;
: none; : ;
: ();
}
Web App
Frontend
API Server
Backend
PostgreSQL
Database