Getting Started
AccordionActionBarAvatar
BadgeBadgedContentBadgeNotification
ButtonButtonGroupButtonSelectButtonX
CalendarCalendarMonthCalendarRange
CarouselChipCommentCompassCopyCounter
DataListDataListWrapperDropdownDropdownContextDropdownHoverDropdownOpenDropdownSelection
ExpandFilter
TooltipHintHintDescribeHintManualHintPointer
IconItemsWithMoreLikeLineClampLinkLoaderMessage
BottomSheetMobileCalendarPullToRefreshSwipeActions
ConfirmDialogDialog routableNotificationMiddlePdfViewerPreviewSheetDialog
NotificationPagerPinPopout
ProgressBarProgressCircleProgressSegmented
PulsePushScrollbarShrinkWrapStatusSurface
ReorderTableTableFiltersTablePagination
ThumbnailCardTilesTimelineTitleToastTree
Taiga UI 5.0 is out!
See what's new

BadgedContent KIT

Examples API GitHub

On this page

Basic Rounded content With different components With image

See also

Badge, Tag

BadgedContent is a wrapper for other components to add badges and notifications to them.

Basic

99
120
99

Rounded content

The wrapped element is assumed to have 12px border-radius. If it is different, override the --tui-radius variable with actual value.

8
Taiga
99

With different components

With image

icon
icon
Logo Taiga UI
GitHub StackBlitz