Your bookmarks

NotificationBadge

Shows simple, non-interactive information.

Interfaces with too many choices and too much information pulling users in different directions often end up with users not completing any action.

When you have simple information like the type of transportation for a segment and users don’t need to interact with it, present it simply with a notification badge.

Component status

Figma
On hold
Web (React)
Released
iOS (Swift)
n/a
Android (Kotlin)
n/a
Sketch
Released

Content structure

Type: visually supports the message with different styles for different types; icon: optionally represent the notification visually and is not an action; content: displays the number of the notification and will not display if an icon is used.