Status tag - Intelligence Community Design System

Skip to page content

Show navigation section

Easy to use for everyone

Status tags use colours that have been designed for maximum legibility across a range of visual impairments.

For Assistive Technology

Status tags can havearia-labelledby oraria-label tags that provide additional content to the visible label. However, the visible label must be included within the accessible label.

Based on

The status tag component has been based on the following resources:

ARIA: status role , Mozilla, accessed July 2022.
Tag component , GDS, accessed July 2022.
Using the status role , Mozilla, accessed July 2022.

Testing

We've tested this component against WCAG 2.2 Level AA. It's been tested with NVDA and VoiceOver, and several different users with different interaction methods.

Last reviewed 15 April 2024 .