Component

Material Design 3 button 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
Motion scheme

Enabled
Enabled tokens
TokenValue
Button large between icon label spacemd.comp.button.large.icon-label-space
md.sys.measurement.space150Show reference chainHide reference chain
md.comp.button.large.icon-label-space
  • md.sys.measurement.space150
12dp
Button large label sizemd.comp.button.large.label-text
md.sys.typescale.headline-smallShow reference chainHide reference chain
md.comp.button.large.label-text
  • md.sys.typescale.headline-small
    • md.sys.typescale.headline-small.font
      • md.ref.typeface.brand
    • md.sys.typescale.headline-small.weight
      • md.ref.typeface.weight-regular
    • md.sys.typescale.headline-small.size
    • md.sys.typescale.headline-small.line-height
    • md.sys.typescale.headline-small.tracking
Roboto · 24pt · weight 400 · line height 32pt · tracking No value specified (pt)
Button large leading spacemd.comp.button.large.leading-space
md.sys.measurement.space600Show reference chainHide reference chain
md.comp.button.large.leading-space
  • md.sys.measurement.space600
48dp
Button large trailing spacemd.comp.button.large.trailing-space
md.sys.measurement.space600Show reference chainHide reference chain
md.comp.button.large.trailing-space
  • md.sys.measurement.space600
48dp
Container
Container tokens
TokenValue
Button large container heightmd.comp.button.large.container.height96dp
Shape
Shape tokens
TokenValue
Button large shape roundmd.comp.button.large.container.shape.round
md.sys.shape.corner.fullShow reference chainHide reference chain
md.comp.button.large.container.shape.round
  • md.sys.shape.corner.full
Circular
Button large shape squaremd.comp.button.large.container.shape.square
md.sys.shape.corner.extra-largeShow reference chainHide reference chain
md.comp.button.large.container.shape.square
  • md.sys.shape.corner.extra-large
Rounded Corners · DefaultSize: 28dp
Icon
Icon tokens
TokenValue
Button large icon sizemd.comp.button.large.icon.size32dp
Outlined
Outline
Outline tokens
TokenValue
Button large outline widthmd.comp.button.large.outlined.outline.width2dp
Selected
Container
Shape
Shape tokens
TokenValue
Button large selected container shape roundmd.comp.button.large.selected.container.shape.round
md.sys.shape.corner.extra-largeShow reference chainHide reference chain
md.comp.button.large.selected.container.shape.round
  • md.sys.shape.corner.extra-large
Rounded Corners · DefaultSize: 28dp
Button large selected container shape squaremd.comp.button.large.selected.container.shape.square
md.sys.shape.corner.fullShow reference chainHide reference chain
md.comp.button.large.selected.container.shape.square
  • md.sys.shape.corner.full
Circular
Pressed
Pressed tokens
TokenValue
Button large shape pressed morphmd.comp.button.large.pressed.container.shape
md.sys.shape.corner.largeShow reference chainHide reference chain
md.comp.button.large.pressed.container.shape
  • md.sys.shape.corner.large
Rounded Corners · DefaultSize: 16dp
Container
Corner Size
Motion
Spring
Spring tokens
TokenValue
Button large shape spring animation dampingmd.comp.button.large.pressed.container.corner-size.motion.spring.damping
md.sys.motion.spring.fast.spatial.dampingShow reference chainHide reference chain
md.comp.button.large.pressed.container.corner-size.motion.spring.damping
  • md.sys.motion.spring.fast.spatial.damping
Numeric: 0.6
Button large shape spring animation stiffnessmd.comp.button.large.pressed.container.corner-size.motion.spring.stiffness
md.sys.motion.spring.fast.spatial.stiffnessShow reference chainHide reference chain
md.comp.button.large.pressed.container.corner-size.motion.spring.stiffness
  • md.sys.motion.spring.fast.spatial.stiffness
Numeric: 800