Badges are static components that show helpful details or attributes.

Badge Intro 01

Badges can be added to a card to display an attribute, quality or state of a particular item. They should be used sparingly to avoid overwhelming the user. They come in five styles for different use cases.


Badges Overview


This badge can be used as an additional attribute or detail that helps with decision-making but doesn’t need urgent attention.


This badge can be used to add greater emphasis to a detail or attribute within a design.


This badge can be used to highlight an action which the user has successfully completed.


This badge can be used as an attribute or detail that may have an impact on the traveller’s decision.


This badge can be used for information that prevents the user from completing an action.


The badge can be used to surface information linked to our brand, such as deals.


Badges Anatomy

Leading icon

An optional leading icon can be used if it adds a visual description of the copy on the label.