流程圖

流程圖由步驟及步驟之間的箭頭組成。它以 flowchart 及其標題開頭。

flowchart Ordering online
direction: right
cart: Fill the cart
group Checkout
  pay: Pay [io]
  check: Card accepted?
  pay -> check
group Warehouse [teal]
  pick: Pick the items
  pack: Pack the box
  pick -> pack
db: Orders [database]
cart -> pay
check -> pick: yes
check -> pay: no, try again [bad]
pick --> db: record
pack -> Ship it [end]

設定

設定	別名	值
direction	flow, orientation, layout, rankdir	箭頭的走向：down（預設）、right、up 或 left —— 也可寫作 TD、LR、BT、RL

像 Mermaid 那樣在第一行寫 flowchart LR 或 graph TD，同樣可以指定方向。所有種類通用的設定 —— title、subtitle、caption、theme、font、size —— 見語言頁面。

步驟

步驟在首次被命名的地方建立，無論是在箭頭行中還是單獨的一行上。再次命名時，不論大小寫和空格如何，指的都是同一個步驟。

單獨一行的 id: Label 為步驟指定一個用於書寫箭頭的短名稱和一個用於顯示的較長標籤：pay: Pay at the till。特性寫在名稱或標籤之後。

箭頭和標籤

由箭頭連線的一行步驟會在每對相鄰步驟之間畫一個箭頭：Wake up -> Shower -> Breakfast。冒號後的文字是該行最後一個箭頭的標籤，標籤後的特性會改變該箭頭：

check -> pay: no, try again [bad, dashed]

箭頭特性	箭頭的繪製方式
顏色或角色	使用該顏色
muted	使用主題的低調墨色
dashed（也可寫作 dotted）	虛線
thick（也可寫作 bold）	粗線
solid	實線

所有箭頭 ->、-->、..>、=>、<-、<->、--、..、== 及其同類，都列在語言頁面上。

形狀

步驟預設是方框，除非其方括號中的某個單詞指定了其他形狀。文字以問號結尾的步驟是一個問題 —— 菱形 —— 除非其方括號為它指定了其他形狀。

形狀	別名
box	rect, rectangle, step, process
round	rounded, soft
pill	stadium, start, end, stop, terminal, begin
circle
diamond	decision, choice, question, if
hexagon	prepare, preparation
io	input, output, data, parallelogram
database	db, store, storage, cylinder
document	doc, file, report
subroutine	call, predefined
note	comment

形狀和顏色可以寫在同一對方括號中：Ship it [end, good]。顏色和角色見語言頁面。

分組

group Name，加上縮排在其下方的所屬各行，會在這些內容周圍畫一個邊框。subgraph 是同一個詞。group id: Label 為分組指定一個短名稱和一個較長的標籤；分組可以巢狀；方括號中的顏色會為分組鋪上該顏色的底色：group Warehouse [teal]。

group Kitchen [orange]
  Boil -> Pour

下方沒有任何縮排內容的分組會收到警告。進入或離開分組內步驟的箭頭，會連到它所指名的那個步驟。

註解

note Step: what to say 會在某個步驟旁邊放置一條註解，並用虛線與之相連：

note Pour: Mind the steam

佈局方式

步驟會根據它們之間的箭頭沿方向分級排列，因此箭頭都朝同一個方向；會構成迴路的箭頭則逆向返回。每一級中的步驟會經過排序以避免箭頭交叉，每個箭頭的標籤都位於其連線上，單個步驟組成的鏈保持在一條直線上，進出分組的連線會畫到它所指名的步驟上。同樣的文字總是會落在同樣的位置。