Badge

Badges are used to inform users of the status of an object or of an action that’s been taken. Use badges to label, categorize, or organize items using keywords that describe them.

Introduction

Use short labels for easy scanning. Use two words only if necessary to describe the status and differentiate it from other tags.

Default

Dismissal

A badge can be dismissed. Use a close icon at the right-most side of a badge to dismiss it.

Secondary

Colors

The badge is available in all the different colors defined by the official brand guideline for Nova's colors. They are 5 main UI colors: primary, secondary, warning, error and success.

Neutral
Primary
Secondary
Success
Error

Icon

The badge can also be used to display an icon