ToggleButton

An individual toggle button (text or icon) - usable standalone or inside a ToggleButtonGroup. Built on Button: it pins variant="outlined" and layers selected/unselected color styles on top, so everything else (size, shape, gap, startIcon / endIcon, loading, fullWidth, space/layout/border/typography props) is inherited. variant, href, target, and rel are not part of the API. Reflects its active state via aria-pressed; when grouped, selection comes from ToggleButtonGroupContext and color / size / disabled / fullWidth from ButtonGroupContext (explicit props always win).

<ToggleButton
  value="check"
  isSelected={isSelected}
  onChange={() => setIsSelected((prev) => !prev)}
  aria-label="check"
>
  <Icon name="check" size="1em" color="inherit" />
</ToggleButton>