Your bookmarks

Badge / React Native

We use badges when we need to inform our users about relevant information, e.g., booking status. The badge is not clickable.

An Orbit component for displaying a badge.

To import the Badge component to your project:

import { Badge } from '@kiwicom/orbit-react-native';


<Badge>I'm a real badge!</Badge>


Table below contains all types of the props available in Badge component.

Name Type Platform Default Description
children React$Node web/native The content of the Badge.
dataTest string web/native Optional prop for testing purposes.
icon React$Node web/native The displayed icon on the left.
type enum web/native "neutral" The color type of the Badge.
ariaLabel string web/native Adds prop adds aria-label to an element, useful for screenreaders.



Functional specs

@TODO Make NotificationBadge