Component

Material Design 3 menu item menus tokens

Browse tokens

Token

See more values

Compare token values by selecting another context

More contexts
Platform
Audience
What do 1P and 3P mean?

1P means first-party; 3P means third-party. We interpret 1P Baseline as the configuration for Google's own products, and 3P as the configuration for other developers.

Material supplies these audience labels but does not define them in the captured data. They are not a baseline-versus-Expressive switch.

Font

Enabled
Enabled tokens
TokenValue
Menu item between spacemd.comp.menus.menu-item.between-space
md.sys.measurement.space150Show reference chainHide reference chain
md.comp.menus.menu-item.between-space
  • md.sys.measurement.space150
12dp
Menu item bottom spacemd.comp.menus.menu-item.bottom-space
md.sys.measurement.space100Show reference chainHide reference chain
md.comp.menus.menu-item.bottom-space
  • md.sys.measurement.space100
8dp
Menu item first child shapemd.comp.menus.menu-item.first-child.shape
md.sys.shape.corner.mediumShow reference chainHide reference chain
md.comp.menus.menu-item.first-child.shape
  • md.sys.shape.corner.medium
Rounded Corners · DefaultSize: 12dp
Menu item heightmd.comp.menus.menu-item.height44dp
Menu item last child shapemd.comp.menus.menu-item.last-child.shape
md.sys.shape.corner.mediumShow reference chainHide reference chain
md.comp.menus.menu-item.last-child.shape
  • md.sys.shape.corner.medium
Rounded Corners · DefaultSize: 12dp
Menu item leading spacemd.comp.menus.menu-item.leading-space
md.sys.measurement.space200Show reference chainHide reference chain
md.comp.menus.menu-item.leading-space
  • md.sys.measurement.space200
16dp
Menu item selected shapemd.comp.menus.menu-item.selected.shape
md.sys.shape.corner.mediumShow reference chainHide reference chain
md.comp.menus.menu-item.selected.shape
  • md.sys.shape.corner.medium
Rounded Corners · DefaultSize: 12dp
Menu item shapemd.comp.menus.menu-item.shape
md.sys.shape.corner.extra-smallShow reference chainHide reference chain
md.comp.menus.menu-item.shape
  • md.sys.shape.corner.extra-small
Rounded Corners · DefaultSize: 4dp
Menu item top spacemd.comp.menus.menu-item.top-space
md.sys.measurement.space100Show reference chainHide reference chain
md.comp.menus.menu-item.top-space
  • md.sys.measurement.space100
8dp
Menu item trailing spacemd.comp.menus.menu-item.trailing-space
md.sys.measurement.space200Show reference chainHide reference chain
md.comp.menus.menu-item.trailing-space
  • md.sys.measurement.space200
16dp
First Child
Inner Corner
Inner Corner tokens
TokenValue
Menu item first child inner corner corner sizemd.comp.menus.menu-item.first-child.inner-corner.corner-size
md.sys.shape.corner.extra-smallShow reference chainHide reference chain
md.comp.menus.menu-item.first-child.inner-corner.corner-size
  • md.sys.shape.corner.extra-small
Rounded Corners · DefaultSize: 4dp
Label Text
Label Text tokens
TokenValue
Menu item label text fontmd.comp.menus.menu-item.label-text.font
md.sys.typescale.label-large.fontShow reference chainHide reference chain
md.comp.menus.menu-item.label-text.font
  • md.sys.typescale.label-large.font
    • md.ref.typeface.plain
Roboto
Menu item label text line heightmd.comp.menus.menu-item.label-text.line-height
md.sys.typescale.label-large.line-heightShow reference chainHide reference chain
md.comp.menus.menu-item.label-text.line-height
  • md.sys.typescale.label-large.line-height
20pt
Menu item label text sizemd.comp.menus.menu-item.label-text.size
md.sys.typescale.label-large.sizeShow reference chainHide reference chain
md.comp.menus.menu-item.label-text.size
  • md.sys.typescale.label-large.size
14pt
Menu item label text trackingmd.comp.menus.menu-item.label-text.tracking
md.sys.typescale.label-large.trackingShow reference chainHide reference chain
md.comp.menus.menu-item.label-text.tracking
  • md.sys.typescale.label-large.tracking
0.1pt
Menu item label text weightmd.comp.menus.menu-item.label-text.weight
md.sys.typescale.label-large.weightShow reference chainHide reference chain
md.comp.menus.menu-item.label-text.weight
  • md.sys.typescale.label-large.weight
    • md.ref.typeface.weight-medium
500
Last Child
Inner Corner
Inner Corner tokens
TokenValue
Menu item last child inner corner corner sizemd.comp.menus.menu-item.last-child.inner-corner.corner-size
md.sys.shape.corner.extra-smallShow reference chainHide reference chain
md.comp.menus.menu-item.last-child.inner-corner.corner-size
  • md.sys.shape.corner.extra-small
Rounded Corners · DefaultSize: 4dp
Leading Icon
Leading Icon tokens
TokenValue
Menu item leading icon sizemd.comp.menus.menu-item.leading-icon.size20dp
Supporting Text
Supporting Text tokens
TokenValue
Menu item supporting text fontmd.comp.menus.menu-item.supporting-text.font
md.sys.typescale.body-small.fontShow reference chainHide reference chain
md.comp.menus.menu-item.supporting-text.font
  • md.sys.typescale.body-small.font
    • md.ref.typeface.plain
Roboto
Menu item supporting text line heightmd.comp.menus.menu-item.supporting-text.line-height
md.sys.typescale.body-small.line-heightShow reference chainHide reference chain
md.comp.menus.menu-item.supporting-text.line-height
  • md.sys.typescale.body-small.line-height
16pt
Menu item supporting text sizemd.comp.menus.menu-item.supporting-text.size
md.sys.typescale.body-small.sizeShow reference chainHide reference chain
md.comp.menus.menu-item.supporting-text.size
  • md.sys.typescale.body-small.size
12pt
Menu item supporting text trackingmd.comp.menus.menu-item.supporting-text.tracking
md.sys.typescale.body-small.trackingShow reference chainHide reference chain
md.comp.menus.menu-item.supporting-text.tracking
  • md.sys.typescale.body-small.tracking
0.4pt
Menu item supporting text weightmd.comp.menus.menu-item.supporting-text.weight
md.sys.typescale.body-small.weightShow reference chainHide reference chain
md.comp.menus.menu-item.supporting-text.weight
  • md.sys.typescale.body-small.weight
    • md.ref.typeface.weight-regular
400
Trailing Icon
Trailing Icon tokens
TokenValue
Menu item trailing icon sizemd.comp.menus.menu-item.trailing-icon.size20dp
Trailing Supporting Text
Trailing Supporting Text tokens
TokenValue
Menu item trailing supporting text fontmd.comp.menus.menu-item.trailing-supporting-text.font
md.sys.typescale.label-large.fontShow reference chainHide reference chain
md.comp.menus.menu-item.trailing-supporting-text.font
  • md.sys.typescale.label-large.font
    • md.ref.typeface.plain
Roboto
Menu item trailing supporting text line heightmd.comp.menus.menu-item.trailing-supporting-text.line-height
md.sys.typescale.label-large.line-heightShow reference chainHide reference chain
md.comp.menus.menu-item.trailing-supporting-text.line-height
  • md.sys.typescale.label-large.line-height
20pt
Menu item trailing supporting text sizemd.comp.menus.menu-item.trailing-supporting-text.size
md.sys.typescale.label-large.sizeShow reference chainHide reference chain
md.comp.menus.menu-item.trailing-supporting-text.size
  • md.sys.typescale.label-large.size
14pt
Menu item trailing supporting text trackingmd.comp.menus.menu-item.trailing-supporting-text.tracking
md.sys.typescale.label-large.trackingShow reference chainHide reference chain
md.comp.menus.menu-item.trailing-supporting-text.tracking
  • md.sys.typescale.label-large.tracking
0.1pt
Menu item trailing supporting text weightmd.comp.menus.menu-item.trailing-supporting-text.weight
md.sys.typescale.label-large.weightShow reference chainHide reference chain
md.comp.menus.menu-item.trailing-supporting-text.weight
  • md.sys.typescale.label-large.weight
    • md.ref.typeface.weight-medium
500
Focused
Indicator
Indicator tokens
TokenValue
Menu item focus indicator thicknessmd.comp.menus.menu-item.focus.indicator.thickness
md.sys.state.focus-indicator.thicknessShow reference chainHide reference chain
md.comp.menus.menu-item.focus.indicator.thickness
  • md.sys.state.focus-indicator.thickness
3dp
Outline
Outline tokens
TokenValue
Menu item focus indicator outline offsetmd.comp.menus.menu-item.focus.indicator.outline.offset
md.sys.state.focus-indicator.inner-offsetShow reference chainHide reference chain
md.comp.menus.menu-item.focus.indicator.outline.offset
  • md.sys.state.focus-indicator.inner-offset
-3dp