mermaid
✓순서도, 시퀀스 다이어그램, 상태 머신, 클래스 다이어그램, 간트 차트, 마인드맵 등을 만듭니다. 프로세스 흐름, API 상호 작용, 시스템 아키텍처 및 기술 문서에 가장 적합합니다. 데이터 기반 차트(베가 사용) 또는 빠른 KPI 시각적 개체(인포그래픽 사용)에는 적합하지 않습니다.
SKILL.md
Quick Start: Identify diagram type (flowchart/sequence/state/class/ER/gantt/mindmap) → Define nodes with shapes → Connect with arrows → Wrap in `mermaid fence. Default: top-to-bottom (TD), use flowchart over graph, Unicode supported.
| Diagram won't render | Check unmatched brackets, quotes | | List syntax error | [1.Item] not [1. Item] | | Subgraph reference fails | Use ID not display name | | Too crowded | Split into multiple diagrams | | Crossing connections | Use different layout direction or invisible edges |
For diagram-specific syntax and advanced features, refer to references below:
순서도, 시퀀스 다이어그램, 상태 머신, 클래스 다이어그램, 간트 차트, 마인드맵 등을 만듭니다. 프로세스 흐름, API 상호 작용, 시스템 아키텍처 및 기술 문서에 가장 적합합니다. 데이터 기반 차트(베가 사용) 또는 빠른 KPI 시각적 개체(인포그래픽 사용)에는 적합하지 않습니다. 출처: xicilion/markdown-viewer-extension.
인용 가능한 정보
AI/검색 인용용 안정적인 필드와 명령어.
- 설치 명령어
npx skills add https://github.com/xicilion/markdown-viewer-extension --skill mermaid- 카테고리
- {}데이터 분석
- 인증됨
- ✓
- 최초 등록
- 2026-02-01
- 업데이트
- 2026-02-18
빠른 답변
mermaid이란?
순서도, 시퀀스 다이어그램, 상태 머신, 클래스 다이어그램, 간트 차트, 마인드맵 등을 만듭니다. 프로세스 흐름, API 상호 작용, 시스템 아키텍처 및 기술 문서에 가장 적합합니다. 데이터 기반 차트(베가 사용) 또는 빠른 KPI 시각적 개체(인포그래픽 사용)에는 적합하지 않습니다. 출처: xicilion/markdown-viewer-extension.
mermaid 설치 방법은?
터미널 또는 명령줄 도구(Terminal, iTerm, Windows Terminal 등)를 엽니다 이 명령어를 복사하여 실행합니다: npx skills add https://github.com/xicilion/markdown-viewer-extension --skill mermaid 설치 후 스킬은 자동으로 AI 코딩 환경에 설정되어 Claude Code나 Cursor에서 사용할 수 있습니다
소스 저장소는 어디인가요?
https://github.com/xicilion/markdown-viewer-extension