BadgeUnstyled API

API reference docs for the React BadgeUnstyled component. Learn about the props, CSS, and other APIs of this exported module.

Demos

For examples and details on the usage of this React component, visit the component demo pages:

import BadgeUnstyled from '@mui/base/BadgeUnstyled';
// or
import { BadgeUnstyled } from '@mui/base';

Props of the native component are also available.

Name	Type	Default	Description
badgeContent	node		The content rendered within the badge.
children	node		The badge will be added relative to this node.
component	elementType		The component used for the root node. Either a string to use a HTML element or a component.
invisible	bool	false	If `true`, the badge is invisible.
max	number	99	Max count to show.
showZero	bool	false	Controls whether the badge is hidden when `badgeContent` is zero.
slotProps	{ badge?: func \| object, root?: func \| object }	{}	The props used for each slot inside the Badge.
slots	{ badge?: elementType, root?: elementType }	{}	The components used for each slot inside the Badge. Either a string to use a HTML element or a component. See Slots API below for more details.

The ref is forwarded to the root element.

Name	Default class	Default value	Description
badge	.MuiBadge-badge	'span'	The component used to render the badge.
root	.MuiBadge-root	'span'	The component used to render the root.