사용자가 다이어그램, 순서도, 아키텍처 다이어그램, ER 다이어그램, UML/시퀀스/클래스 다이어그램, 네트워크 토폴로지, ML/DL 모델 도형(Transformer/CNN/LSTM), 마인드맵 또는 시각화를 요청할 때 사용합니다. 또한 3개 이상의 구성 요소, 복잡한 데이터 흐름 또는 시각적 표현이 유리한 관계를 설명할 때 능동적으로 사용합니다. 사용자 정의 스타일링, 풍부한 도형 어휘, 스윔레인 또는 내보내기 가능한 이미지(PNG/SVG/PDF/JPG)가 필요할 때 가장 적합합니다. .drawio XML을 생성하고 네이티브 draw.io 데스크톱 CLI를 통해 로컬로 내보냅니다.
이 스킬은 사용자 요청에 따라 다양한 유형의 다이어그램과 시각화 자료를 생성하고 내보내기 위해 설계되었습니다. 순서도, 아키텍처 다이어그램, ER 다이어그램, UML 다이어그램(시퀀스/클래스), 네트워크 토폴로지, ML/DL 모델 도형(Transformer, CNN, LSTM), 마인드맵 등을 포함하며, 시스템 설명 시 3개 이상의 구성 요소나 복잡한 데이터 흐름이 있을 때 능동적으로 사용하는 것이 권장됩니다. 이 스킬은 사용자 정의 스타일링, 풍부한 도형 어휘, 스윔레인을 지원하며, 생성된 .drawio XML 파일을 네이티브 draw.io 데스크톱 CLI를 통해 PNG, SVG, PDF, JPG 형식으로 로컬 내보내기할 수 있습니다. 모든 AI 어시스턴트 플랫폼(Claude Code, Cursor, Codex 등)에서 사용 가능하며, 핵심 동작은 'SKILL.md' 문서에 정의된 지침에 따라 drawio-cli 도구를 활용하여 다이어그램 파일을 생성, 저장, 내보내기합니다.
npx skills add https://github.com/agents365-ai/365-skills/tree/main/skills/drawio-skillInstalled? Explore more 이미지 skills: steipete/songsee, affaan-m/frontend-design, mattpocock/improve-codebase-architecture · View all 6 →
사용자가 다이어그램, 순서도, 아키텍처 다이어그램, ER 다이어그램, UML/시퀀스/클래스 다이어그램, 네트워크 토폴로지, ML/DL 모델 도형(Transformer/CNN/LSTM), 마인드맵 또는 시각화를 요청할 때 사용합니다. 또한 3개 이상의 구성 요소, 복잡한 데이터 흐름 또는 시각적 표현이 유리한 관계를 설명할 때 능동적으로 사용합니다. 사용자 정의 스타일링, 풍부한 도형 어휘, 스윔레인 또는 내보내기 가능한 이미지(PNG/SVG/PDF/JPG)가 필요할 때 가장 적합합니다. .drawio XML을 생성하고 네이티브 draw.io 데스크톱 CLI를 통해 로컬로 내보냅니다.
Generate spectrograms and feature-panel visualizations from audio with the songsee CLI.
Create distinctive, production-grade frontend interfaces with high design quality. Use when the user asks to build web components, pages, or applications and the visual direction matters as much as the code quality.
Scan a codebase for deepening opportunities, present them as a visual HTML report, then grill through whichever one you pick.
Add documentation for a new AI provider — usage docs, env vars, Docker config, image resources.
Tests in real browsers via Chrome DevTools MCP. Use when building or debugging anything that runs in a browser. Use when you need to inspect the DOM, capture console errors, analyze network requests, profile performance, or verify visual output with real runtime data. Requires the chrome-devtools MCP server to be configured.
This skill should be used when the user wants to visualize data. It intelligently selects the most suitable chart type from 26 available options, extracts parameters based on detailed specifications, and generates a chart image using a JavaScript script.