Skills › Scientific Agent Skills › markdown-mermaid-writing › pie.md

pie.md

57 lines · skills/markdown-mermaid-writing/references/diagrams/pie.md at 5f2bc03

1

3# Pie Chart

5> **Back to [Style Guide](../mermaid_style_guide.md)** — Read the style guide first for emoji, color, and accessibility rules.

7**Syntax keyword:** `pie`

8**Best for:** Simple proportional breakdowns, budget allocation, composition, survey results

9**When NOT to use:** Trends over time (use [XY Chart](xy_chart.md)), exact comparisons (use a table), more than 7 categories

11---

Pie Chart

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

Syntax keyword: pie Best for: Simple proportional breakdowns, budget allocation, composition, survey results When NOT to use: Trends over time (use XY Chart), exact comparisons (use a table), more than 7 categories

Raw lines 1 to 12

13## Exemplar Diagram

15```mermaid

16pie

17 accTitle: Engineering Time Allocation

18 accDescr: Pie chart showing how engineering team time is distributed across feature work, tech debt, bug fixes, on-call, and learning

20 title 📊 Engineering Time Allocation

21 "🔧 Feature development" : 45

22 "🔄 Tech debt reduction" : 20

23 "🐛 Bug fixes" : 20

24 "📱 On-call & support" : 10

25 "📚 Learning & growth" : 5

26```

28---

Exemplar Diagram

pie
    accTitle: Engineering Time Allocation
    accDescr: Pie chart showing how engineering team time is distributed across feature work, tech debt, bug fixes, on-call, and learning

    title 📊 Engineering Time Allocation
    "🔧 Feature development" : 45
    "🔄 Tech debt reduction" : 20
    "🐛 Bug fixes" : 20
    "📱 On-call & support" : 10
    "📚 Learning & growth" : 5

Raw lines 13 to 29

30## Tips

32- Values are proportional — they do not need to sum to 100, but must be nonnegative parts of the same defined whole with a positive total. Report the denominator and exact values

33- Use descriptive labels with **emoji prefix** for visual distinction

34- Limit to **7 slices maximum** — group small ones into "📦 Other"

35- Always include a `title` with relevant emoji

36- Order slices largest to smallest for readability

38---

Tips

Values are proportional — they do not need to sum to 100, but must be nonnegative parts of the same defined whole with a positive total. Report the denominator and exact values
Use descriptive labels with emoji prefix for visual distinction
Limit to 7 slices maximum — group small ones into "📦 Other"
Always include a title with relevant emoji
Order slices largest to smallest for readability

Raw lines 30 to 39

40## Template

42```mermaid

43pie

44 accTitle: Your Title Here

45 accDescr: Describe what proportions are being shown

47 title 📊 Your Chart Title

48 "📋 Category A" : 40

49 "🔧 Category B" : 30

50 "📦 Category C" : 20

51 "🗂️ Other" : 10

52```

Template

pie
    accTitle: Your Title Here
    accDescr: Describe what proportions are being shown

    title 📊 Your Chart Title
    "📋 Category A" : 40
    "🔧 Category B" : 30
    "📦 Category C" : 20
    "🗂️ Other" : 10

Raw lines 40 to 54

55## Verified reference

57Syntax examples reviewed against [official Mermaid documentation](https://mermaid.js.org/syntax/pie.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 55 to 57