Introduction

The StatusIndicator subtly indicates the state of something to a user. It is a colored circle next to text. It is best used in a table to indicate the status of a particular item.

jsx

<Pane display="flex" flexDirection="column">
  <StatusIndicator color="success">Success</StatusIndicator>
  <StatusIndicator color="warning">Warning</StatusIndicator>
  <StatusIndicator color="danger">Danger</StatusIndicator>
  <StatusIndicator>None</StatusIndicator>
  <StatusIndicator color="disabled">Disabled</StatusIndicator>
  <StatusIndicator color="#ED55C2">Custom Color</StatusIndicator>
</Pane>