HTML/SVG (Claude Code/Codex/Pi용 Agent Skill)GitHub에서 보기 →
웹사이트나 문서에 브랜드에 맞는 고품질 다이어그램을 빠르게 만들고 싶은 Claude Code/Codex/Pi 사용자
- 아키텍처, 플로우차트, 시퀀스 등 27가지 다이어그램 유형을 정적 HTML(라이트/다크/에디토리얼)로 제공한다.
- 사용자 웹사이트에서 팔레트와 폰트를 추출해 60초 만에 브랜드에 맞는 스타일을 적용하는 온보딩 기능이 있다.
- draw.io와 Mermaid 소스를 같은 디자인 시스템으로 다시 그리는 import 기능을 지원한다.
- 포맷·크기·디테일·대상 청중 네 가지 다이얼로 출력을 용도에 맞게 조정할 수 있다.
- 다이어그램을 PNG/SVG로 내보내는 export 기능과 접근성(WCAG AA 대비, ARIA) 검사를 자동 수행한다.
설치: Claude Code: /plugin marketplace add cathrynlavery/diagram-design 후 /plugin install diagram-design@diagram-design