Create diagrams and visualizations using Mermaid.js v11 syntax. Use when generating flowcharts, sequence diagrams, class diagrams, state diagrams, ER diagrams, Gantt charts, user journeys, timelines, architecture diagrams, or any of 24+ diagram types. Supports JavaScript API integration, CLI rendering to SVG/PNG/PDF, theming, configuration, and accessibility features. Essential for documentation, technical diagrams, project planning, system architecture, and visual communication.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
실행 점수 미검증
설치 방법 보기설치하기 전에 에이전트에게 전달되는 지시 내용을 확인할 수 있습니다.
Create text-based diagrams using Mermaid.js v11 declarative syntax. Convert code to SVG/PNG/PDF via CLI or render in browsers/markdown files.
Basic Diagram Structure:
{diagram-type}
{diagram-content}
Common Diagram Types:
flowchart - Process flows, decision treessequenceDiagram - Actor interactions, API flowsclassDiagram - OOP structures, data modelsstateDiagram - State machines, workflowserDiagram - Database relationshipsgantt - Project timelinesjourney - User experience flowsSee references/diagram-types.md for all 24+ types with syntax.
Inline Markdown Code Blocks:
```mermaid
flowchart TD
A[Start] --> B{Decision}
B -->|Yes| C[Action]
B -->|No| D[End]
```
Configuration via Frontmatter:
```mermaid
---
theme: dark
---
flowchart LR
A --> B
```
Comments: Use %% prefix for single-line comments.
Convert .mmd files to images:
# Installation
npm install -g @mermaid-js/mermaid-cli
# Basic conversion
mmdc -i diagram.mmd -o diagram.svg
# With theme and background
mmdc -i input.mmd -o output.png -t dark -b transparent
# Custom styling
mmdc -i diagram.mmd --cssFile style.css -o output.svg
See references/cli-usage.md for Docker, batch processing, and advanced workflows.
HTML Embedding:
<pre class="mermaid">
flowchart TD
A[Client] --> B[Server]
</pre>
<script src="https://cdn.jsdelivr.net/npm/mermaid@latest/dist/mermaid.min.js"></script>
<script>mermaid.initialize({ startOnLoad: true });</script>
See references/integration.md for Node.js API and advanced integration patterns.
Common Options:
theme: "default", "dark", "forest", "neutral", "base"look: "classic", "handDrawn"fontFamily: Custom font specificationsecurityLevel: "strict", "loose", "antiscript"See references/configuration.md for complete config options, theming, and customization.
Load references/examples.md for:
references/diagram-types.md - Syntax for all 24+ diagram typesreferences/configuration.md - Config, theming, accessibilityreferences/cli-usage.md - CLI commands and workflowsreferences/integration.md - JavaScript API and embeddingreferences/examples.md - Practical patterns and use cases아직 리뷰가 없습니다. 사용해 본 소감을 남겨 주세요.
로그인 없이 쓸 수 있습니다. 사용 후기, 질문, 작동하지 않은 환경 등을 편하게 남겨 주세요.
아직 댓글이 없습니다. 첫 댓글을 남겨 보세요.
Build robust backend systems — APIs (REST, GraphQL, gRPC), authentication (OAuth 2.1, JWT), databases, performance optimization, security (OWASP Top 10), scalability patterns (microservices, caching, sharding), and testing. Use when designing APIs, implementing auth, optimizing queries, handling security vulnerabilities, building microservices, or developing production-ready backend systems.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Terse output mode — strips filler/articles/hedging, ~75% token reduction. Activate whenever: context is filling up, user says be brief/terse/caveman/less tokens, or CAVEMAN_TRIGGERED appears in context. Persists every response until CAVEMAN_RELEASED or user says stop/normal mode.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Explore and debate solutions before writing code. Use when the user poses a design question, asks "how should I approach X", wants to think through options before committing, or says anything like "let's brainstorm", "what's the best way to...", "I'm not sure how to tackle this", or "should I use X or Y". Always runs before /ck:plan for novel or ambiguous features. No code is written — only: explore → clarify → spec → report.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Implement a feature phase by phase from a phased JSON master or Markdown plan. Before each phase, confirm whether to create/run unit tests and whether to run ck:quality, unless explicit flags supply those choices. Supports token-budgeted execution, resumable state, and TDD handoff to ck:test.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Fix a bug using Scout → Diagnose → Fix → Review → Finalize. Use when the user pastes an error message, stack trace, or test failure, or says "fix this bug", "something's broken", "tests are failing", "I'm getting an error". Also accepts `--from-quality <report>` or `--from-test <report>` to fix exactly the findings/failures a report lists. Modes (pick one): --fast (trivial errors — lint, type, build — skip scout and review), --hard (mandatory review, no auto-approve).
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Plan a feature or system before implementation. Use when the user says "plan this", "I want to build X", "how do I implement Y", or when /ck:brainstorm produces a spec.md. Always run before /ck:cook. Modes (pick one): --fast (simple, single-file), --hard (research + red-team + validate). Composable flag (combine with any mode): --tdd — propagates into the cook pipeline. Every phase gets Design Constraints and Quality/Testing State; ck:cook confirms optional test and quality checks per phase.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.