voidlight00/dptd-harness/kami-svg-diagrams

Claude Code and agent skill by voidlight00/dptd-harness

Trust tier 3
  • community
Source check pending

Checking that the SKILL.md file is still in the repository.

Kami 14종 SVG 다이어그램(Architecture / Flowchart / Bar Chart / Donut Chart / Timeline / Process Flow / Data Comparison / Network Diagram / Gantt Chart / Scatter Plot / Heat Map / Tree Structure / Sankey Diagram / Matrix) 매칭 룰과 인라인 SVG 합성 방법론. kami-diagram-composer 에이전트가 P4 phase에서 사용. 모든 다이어그램은 잉크블루 단일 강조 + 양피지 배경 + 따뜻한 그레이만, 그라데이션·다중 색상·hard drop shadow 금지.

Install

npx vskill@latest install voidlight00/dptd-harness/kami-svg-diagrams

SKILL.md

Kami SVG Diagrams

14종 매칭 룰

다이어그램본문 트리거 (한국어/영어)권장 doc_type
Architecture"구조 / 시스템 / 컴포넌트 + 3+ 요소 + 연결"long-doc, equity-report, landing-page
Flowchart"단계 / 절차 / 분기 / yes-no 조건"long-doc, one-pager
Bar Chart카테고리별 수치 비교 (3~12개 라벨)equity-report, long-doc, slides
Donut Chart비율 합 100% (≤5 슬라이스)equity-report, one-pager
Timeline날짜+이벤트 (3+)portfolio, changelog
Process Flow입력→처리→출력 (linear)long-doc, landing-page
Data ComparisonA vs B vs C 표 (행 5+)equity-report
Network Diagram관계 그래프 (5+ 노드)long-doc, portfolio
Gantt Chart스케줄+마일스톤 (기간 명시)long-doc, portfolio
Scatter Plot(x,y) 좌표쌍 10+equity-report
Heat Map2D matrix + 강도long-doc, equity-report
Tree Structure계층 / org chartlong-doc, portfolio
Sankey Diagramflow + 양적 변화equity-report
Matrix2×2 / 3×3 (BCG, SWOT 등)one-pager, slides

알고리즘

  1. 본문 섹션별 트리거 키워드 스캔
  2. confidence ≥ 0.6 후보만 생성
  3. 한 섹션당 최대 1개
  4. 본문에 이미 같은 정보가 표/리스트로 있으면 다이어그램 우선 + 표는 캡션으로 보조

스타일 룰 (모든 SVG 공통)

허용 색상:

  • #f5f4ed (parchment, 배경)
  • #1B365D (brand, 단일 강조)
  • #E4ECF5 (brand-tint-strong, 채움)
  • #141413, #3d3d3a, #504e49, #6b6a64 (warm gray scale)
  • #e8e6dc, #e5e3d8 (border)

금지:

  • 다중 chromatic (red/green/yellow 추가)
  • <linearGradient>, <radialGradient>
  • filter 기반 hard drop shadow
  • font-style="italic"
  • font-weight="bold" (500 고정, label은 600)
  • rgba(), hsla()

허용 깊이 표현:

  • 1pt ring stroke (stroke="#e8e6dc" stroke-width="1")
  • 잉크블루 단일 강조 (CTA 영역, primary 노드, primary edge)
  • 따뜻한 그레이 스케일로 데이터 위계

폰트

svg
<text font-family="Noto Serif KR, Charter, Georgia, serif"
font-weight="500"
font-size="11"
fill="#141413">텍스트</text>

systemfont 우선 (WeasyPrint PDF 외부 fetch 부담 최소화).

diagrams.manifest.json 스키마

json
{
"run_id": "<run_id>",
"diagrams": [
{
"id": "d-01",
"type": "architecture",
"file": "d-01-architecture.svg",
"anchor_heading": "## 시스템 구조",
"insert_after_line": 42,
"confidence": 0.85,
"caption": "코깍지알 그룹챗 협업 구조",
"source_section_lines": [38, 60],
"data_extracted": {
"nodes": ["봇", "사용자A", "사용자B"],
"edges": [["사용자A","봇"],["봇","사용자B"]]
}
}
]
}

안전 룰

  • mockup 수치 / 가짜 데이터 절대 금지 — 본문에 실제 데이터 없으면 다이어그램 생성 안 함
  • numeric 정확도 유지 + 텍스트 라벨로 정확 값 동반
  • 다이어그램 생성 실패 시 silent fallback (원본 표/리스트 유지)
  • PDF 1개당 다이어그램 8개 초과 시 conductor에 시각 과부하 경고
  • WeasyPrint 호환 인라인 SVG만 (<img src="..."> 외부 참조 금지)

Reference

각 14종 다이어그램의 SVG 템플릿 사양은 upstream Kami references/diagrams.md (19,587 byte) 참조. 필요 시 gh api repos/tw93/kami/contents/references/diagrams.md --jq .content | base64 -d 로 fetch.

Security

  • Security scanPassed, 95 of 100Pattern checks on the skill's files.
  • Model reviewPassed

Quality evaluation

  • Task evaluationNot runNo evaluation yet. Run one in Skill Studio.

Source

Popularity

7-day trend score
5

Not refreshed yet.

Works with

Any agent vskill installs to: 56 targets in all. These 39 have a page on this site.

  • Claude Code
  • Cursor
  • GitHub Copilot
  • Windsurf
  • Codex
  • Gemini CLI
  • Cline
  • Amp
  • Roo Code
  • Goose
  • Continue
  • Kilo Code
  • Junie
  • Trae
  • OpenHands
  • Qwen Code
  • AI Agent
  • Tabnine Chat
  • Sourcegraph Cody
  • Amazon Q
  • Firebase Genkit
  • Sweep
  • Devin
  • Phind
  • Mentat
  • Claude Desktop
  • Aider
  • GPT Pilot
  • Plandex
  • bolt.new
  • v0
  • Replit Agent
  • Anse
  • TypingMind
  • BetterChatGPT
  • LibreChat
  • Warp AI
  • Pieces
  • Fig AI
Embed badge
vskill VERIFIED badge
[![vskill VERIFIED](https://verified-skill.com/api/v1/skills/voidlight00/dptd-harness/kami-svg-diagrams/badge)](https://verified-skill.com/skills/voidlight00/dptd-harness/kami-svg-diagrams)

Something wrong with this skill or its page? Tell us.