Skill Tracer
Skills › Scientific Agent Skills › markdown-mermaid-writing › kanban.md

kanban.md

112 lines · skills/markdown-mermaid-writing/references/diagrams/kanban.md at 5f2bc03

Open on GitHub
1<!-- Source: https://github.com/SuperiorByteWorks-LLC/agent-project | License: Apache-2.0 | Author: Clayton Young / Superior Byte Works, LLC (Boreal Bytes) -->
2
3# Kanban Board
4
5> **Back to [Style Guide](../mermaid_style_guide.md)** — Read the style guide first for emoji, color, and accessibility rules.
6
7**Syntax keyword:** `kanban`
8**Best for:** Task status boards, workflow columns, work-in-progress visualization, sprint status
9**When NOT to use:** Task timelines/dependencies (use [Gantt](gantt.md)), process logic (use [Flowchart](flowchart.md))
11> ⚠️ **Accessibility:** Kanban boards do **not** support `accTitle`/`accDescr`. Always place a descriptive _italic_ Markdown paragraph directly above the code block.
13---

<!-- Source: https://github.com/SuperiorByteWorks-LLC/agent-project | License: Apache-2.0 | Author: Clayton Young / Superior Byte Works, LLC (Boreal Bytes) -->

Kanban Board

Back to Style Guide — Read the style guide first for emoji, color, and accessibility rules.

Syntax keyword: kanban Best for: Task status boards, workflow columns, work-in-progress visualization, sprint status When NOT to use: Task timelines/dependencies (use Gantt), process logic (use Flowchart)

⚠️ Accessibility: Kanban boards do not support accTitle/accDescr. Always place a descriptive italic Markdown paragraph directly above the code block.

Raw lines 1 to 14
15## Exemplar Diagram
17_Kanban board showing the current sprint's work items distributed across four workflow columns, with emoji indicating column status:_
19```mermaid
20kanban
21backlog[Backlog]
22 task1[🔐 Upgrade auth library]
23 task2[🛡️ Add rate limiting]
24 task3[📚 Write API docs]
25in_progress[In Progress]
26 task4[📊 Build dashboard]
27 task5[🐛 Fix login bug]
28in_review[In Review]
29 task6[💰 Refactor payments]
30done[Done]
31 task7[📊 Deploy monitoring]
32 task8[⚙️ Update CI pipeline]
33```
35> ⚠️ **Tip:** Each task gets ONE domain emoji at the start — this is your primary visual signal for categorization. Column emoji indicates workflow state.
37---

Exemplar Diagram

Kanban board showing the current sprint's work items distributed across four workflow columns, with emoji indicating column status:

kanban
backlog[Backlog]
  task1[🔐 Upgrade auth library]
  task2[🛡️ Add rate limiting]
  task3[📚 Write API docs]
in_progress[In Progress]
  task4[📊 Build dashboard]
  task5[🐛 Fix login bug]
in_review[In Review]
  task6[💰 Refactor payments]
done[Done]
  task7[📊 Deploy monitoring]
  task8[⚙️ Update CI pipeline]
⚠️ Tip: Each task gets ONE domain emoji at the start — this is your primary visual signal for categorization. Column emoji indicates workflow state.

Raw lines 15 to 38
39## Tips
41- Name columns with **status emoji** for instant visual scanning
42- Add **domain emoji** to tasks for quick categorization
43- Keep to **3–5 columns**
44- Limit to **3–4 items per column** (representative, not exhaustive)
45- Items are simple text descriptions — keep concise
46- Good for sprint snapshots in documentation
47- **Always** pair with a Markdown text description above for screen readers
49---

Tips

  • Name columns with status emoji for instant visual scanning
  • Add domain emoji to tasks for quick categorization
  • Keep to 3–5 columns
  • Limit to 3–4 items per column (representative, not exhaustive)
  • Items are simple text descriptions — keep concise
  • Good for sprint snapshots in documentation
  • Always pair with a Markdown text description above for screen readers

Raw lines 39 to 50
51## Template
53_Description of the workflow columns and what the board represents. This example uses 6 columns; adapt to the actual workflow:_
55```mermaid
56kanban
57backlog[Backlog]
58 task1[🔧 Task description]
59 task2[📝 Task description]
60in_progress[In Progress]
61 task3[⚙️ Task description]
62in_review[In Review]
63 task4[👀 Task description]
64done[Done]
65 task5[🚀 Task description]
66blocked[Blocked]
67 task6[⛔ Task description]
68wont_do[Won't Do]
69 task7[❌ Task description]
70```
72> ⚠️ This example includes 6 columns — Backlog, In Progress, In Review, Done, Blocked, Won't Do. Even if a column is empty, include a placeholder item like [No items yet] to make the structure explicit.
74---

Template

Description of the workflow columns and what the board represents. This example uses 6 columns; adapt to the actual workflow:

kanban
backlog[Backlog]
  task1[🔧 Task description]
  task2[📝 Task description]
in_progress[In Progress]
  task3[⚙️ Task description]
in_review[In Review]
  task4[👀 Task description]
done[Done]
  task5[🚀 Task description]
blocked[Blocked]
  task6[⛔ Task description]
wont_do[Won't Do]
  task7[❌ Task description]
⚠️ This example includes 6 columns — Backlog, In Progress, In Review, Done, Blocked, Won't Do. Even if a column is empty, include a placeholder item like [No items yet] to make the structure explicit.

Raw lines 51 to 75
76## Complex Example
78_Sprint W07 board for the Payments Team showing a realistic distribution of work items across all six columns, including blocked items:_
80```mermaid
81kanban
82backlog[Backlog]
83 b1[📊 Add pool monitoring to auth]
84 b2[🔍 Evaluate PgBouncer]
85 b3[📝 Update runbook for pool alerts]
86in_progress[In Progress]
87 ip1[📊 Build merchant dashboard MVP]
88 ip2[📚 Write v2 API migration guide]
89 ip3[🔐 Add OAuth2 PKCE flow]
90in_review[In Review]
91 r1[🛡️ Request validation middleware]
92done[Done]
93 d1[🛡️ Rate limiting on /v2/charges]
94 d2[🐛 Fix pool exhaustion errors]
95 d3[📊 Pool utilization alerts]
96blocked[Blocked]
97 bl1[🔄 Auth service pool config]
98wont_do[Won't Do]
99 w1[❌ Mobile SDK in this sprint]
100```
102Tips for complex kanban diagrams:
104- Add a Blocked column to surface stalled work — this is the highest-signal column on any board
105- Keep items to 3–4 per column max even in complex boards — the diagram is a summary, not an exhaustive list
106- Use the same emoji per domain across columns for visual tracking (📊 = dashboards, 🛡️ = security, 🐛 = bugs)
107- This example uses 6 columns; adapt to the actual workflow — use placeholder items like [No items] when a column is empty

Complex Example

Sprint W07 board for the Payments Team showing a realistic distribution of work items across all six columns, including blocked items:

kanban
backlog[Backlog]
  b1[📊 Add pool monitoring to auth]
  b2[🔍 Evaluate PgBouncer]
  b3[📝 Update runbook for pool alerts]
in_progress[In Progress]
  ip1[📊 Build merchant dashboard MVP]
  ip2[📚 Write v2 API migration guide]
  ip3[🔐 Add OAuth2 PKCE flow]
in_review[In Review]
  r1[🛡️ Request validation middleware]
done[Done]
  d1[🛡️ Rate limiting on /v2/charges]
  d2[🐛 Fix pool exhaustion errors]
  d3[📊 Pool utilization alerts]
blocked[Blocked]
  bl1[🔄 Auth service pool config]
wont_do[Won't Do]
  w1[❌ Mobile SDK in this sprint]

Tips for complex kanban diagrams:

  • Add a Blocked column to surface stalled work — this is the highest-signal column on any board
  • Keep items to 3–4 per column max even in complex boards — the diagram is a summary, not an exhaustive list
  • Use the same emoji per domain across columns for visual tracking (📊 = dashboards, 🛡️ = security, 🐛 = bugs)
  • This example uses 6 columns; adapt to the actual workflow — use placeholder items like [No items] when a column is empty
Raw lines 76 to 109
110## Verified reference
112Syntax examples reviewed against [official Mermaid documentation](https://mermaid.js.org/syntax/kanban.html) and rendered with Mermaid 12.0.0 (2026-10-01). Check the destination version; appearance and accessibility are not guaranteed by a successful parse.

Verified reference

Syntax examples reviewed against official Mermaid documentation and rendered with Mermaid 12.0.0 (2026-10-01). Check the destination version; appearance and accessibility are not guaranteed by a successful parse.

Raw lines 110 to 112