Cmd/Ctrl + K to search
ESC to clear / exit
Mews Design System
  • Welcome
  • Get Started
  • Contribution
  • Updates
  • Foundations
  • Components
    • Overview
    • Accordion
    • Alert
    • App Bar
    • Autocomplete
    • Avatar
    • Badge
      • Overview
      • Style
      • Usage
      • React
      • Flutter
      • Accessibility
    • Banner
    • Breadcrumbs
    • Button
    • Card
    • Chat
    • Checkbox
    • Chip
    • Chip Input
    • Date Picker
    • Data Visualization
    • Dialog
    • Divider
    • Drawer
    • Dropdown Button
    • Dropzone
    • Empty State
    • Expandable Content
    • Flag
    • Fields
    • Icon
    • Icon Button
    • Icon List
    • Image
    • Link
    • Mews Logo
    • Month Picker
    • Number Input
    • Password Input
    • Pictogram
    • Progress Indicator
    • Radio Button
    • Range Date Picker
    • Search Input
    • Segmented Control
    • Select
    • Selection Card Group
    • Side Menu
    • Signature Input
    • Simple List
    • Side Panel
    • Skeleton
    • Skip Link
    • Spinner
    • Split Button
    • Status Indicator
    • Stepper
    • Table
    • Tabs
    • Tag
    • Text Area
    • Text Input
    • Time Picker
    • Toggle
    • Tooltip
  • Patterns
  • Layout
  • Resources
  • Getting Help
Powered by Supernova

Badge

Badges serve the purpose of swiftly indicating the status of an item.

  • Overview
  • Style
  • Usage
  • React
  • Flutter
  • Accessibility

Anatomy

Anatomy

Item

Name

Token

1

Badge

background.accent.primary

2

Label or number

body/XS-strong

text.static.inverse

 

Badge
Overview
Badge
Usage
On this page
  • Anatomy

© 2025 Mews Design System. Page last updated on Dec 26, 2024, 15:33