The desktop menu bar: four words on a 210-wide strip, and behind each of them a menu whose rows carry ticks, dots, shortcuts and submenus - twenty-five...
Seven components, twenty-five variants
Menubar / Item / Default - Level × Variant × State: 1 · 2 × Default · Destructive · Checkbox · Radio × Default · Hover · Disabled - Checkbox and Radio are Level 2 only
Menubar / Trigger - Open × Placement: No · Yes × Top · Bottom - 40 × 24, open takes base.muted
Menubar / Item / SubTrigger - Active: Off · On - an item with a chevron instead of a shortcut
Menubar - none: 210 × 32 - the bar itself, four triggers 4 apart on a base.input line
Menubar / Menu - none: 192 × 220 - a base.foreground panel showing one row of every kind
Menubar / Item / Separator - none: 192 × 8 - a 1px base.border line that fills whatever width it is dropped into
Using the Menubar
What does Level actually change?
The indent, and nothing else. Level 1 starts its text 6 from the left edge; Level 2 reserves a 16px slot for a tick or a dot and starts at 28. A menu holding one checkable item puts every row in it on Level 2, so the labels line up whether or not they carry a mark.
Why is Item eighteen rather than twenty-four?
Because Checkbox and Radio only exist at Level 2. An item carrying a mark is by definition in a menu that indents, so the six Level 1 combinations that could not occur were never drawn. Default and Destructive are the only variants with both levels.
How does Destructive behave on hover?
It is the one row that inverts. Everything else hovers to a base.muted block and keeps its text colour; Destructive fills with base.destructive and flips label and shortcut to base.destructive-foreground. Delete Account should look like what it is before you release the mouse.
What is the difference from Dropdown Menu and Context Menu?
The trigger, essentially. All three share the same 312-wide item, the same Level indent and the same destructive treatment; Menubar is the one whose triggers live on a persistent 210 × 32 bar rather than appearing where you clicked. Learn the item once and all three read the same.