Toolbar

A title and action composition for application headers, card headers, and section controls. Toolbar owns title wrapping, action grouping, and responsive shrink behavior.

Props

PropTypeDefaultDescription
headlineReactNodeRequiredPrimary title
bodyReactNode-Supporting title text
leadingReactNode-Leading identity or icon
actionsReactNode-One or more trailing actions
headlineSizeSize"xlarge"Title size
headlineBoldbooleantrueEmphasize the title
bodyEllipsisbooleanfalseTruncate supporting text
Atlas workspace
Product planning · 8 collaborators
<Toolbar
  headline="Atlas workspace"
  body="Product planning · 8 collaborators"
  leading={<Avatar name="Atlas workspace" />}
  actions={<Button color="primary">New task</Button>}
/>