Status indicator
Status indicator
StatusIndicator
is a specialized icon that you can use to indicate a particular status (info, warning, error or success). You can use it on its own or within another component (e.g. Tooltip
) to help convey a message.
Examples
How to use
Accessibility
Density
Mode
Use the status
prop to change the displayed status. This will affect both
the icon and the color of StatusIndicator
. The status indicator offers
four severity levels that set a distinctive indicator and color.
You can control the size of the Status Indicator with the size
prop. This
number will multiply the base size as described in the
scale and size
foundations.
We recommend that you add a self-explanatory header/label next to the status indicator to help end users to understand the type of status indicated.