Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Overview

  • Badges are colored text elements containing a small amount of information

  • It is used for labeling content and highlighting information

  • A Badge can be used to display unread notifications or to label a block of text

  • Badges do not work for navigation because they can not include a hyperlink

Image RemovedImage Added

Attributes

Label

  • The label is a short description displayed on the badge

Image RemovedImage Added

Variant

Allows you to show badge in different color format

  • The Badge comes in a six variants

    • Default: Default is used to display the default color of the badge, which is displayed in white color

    • Inverse: Shows Badge in grey color

    • Lightest: Shows Badge in white color

    • Success: Shows Badge in green color

    • Warning: Shows Badge in orange color

    • Error: Shows Badge in red color

Image RemovedImage Added

Left Icon

This is an icon selector using which you can select the icon you want to be displayed on the left side of the Badge Label

Right Icon

This is an icon selector using which you can select the icon you want to be displayed on the right side of the Badge Label

 

Include Page
Common configurations for components at the layout
Common configurations for components at the layout