A NSW Government website
Design System v3.7.0

Status labels

Status labels communicate a level of severity or status of an object to users.

Usage

Use to indicate a desired status to users or provide a state that requires attention. Status labels stand out from other content to draw a users attention to important content.

Do

  • place status labels as close to the element as possible to strengthen its connection
  • use clear labels with short, scannable text (single words where possible)
  • use adjectives rather than verbs so the user doesn’t think that clicking them will perform an action.

Types of status

Status labels are styled according to their purpose:

  • Information - Use when the status is informative or new and also has a neutral meaning (ie. new, coming soon)
  • Success - Use to communicate a successful or positive status (ie. available, approved, completed etc)
  • Warning - Use to communicate when action is required or to avoid incurring an impending error (ie. missing information, expiring soon etc)
  • Error - Use to communicate an issue or failure that needs resolving (ie. expired, failed, cancelled etc)
  • Neutral - Use when a status is not available or does not fall into a state above (ie. inactive, not available, not provided etc)

When to avoid

Do not use

  • to filter content, consider tags
  • as a link, consider text links
  • to trigger an action, consider buttons

Accessibility

All components are responsive and meet WCAG 2.1 AA accessibility guidelines.

Information Success Warning Error Neutral