BadgeComponent

Represents the Kendo UI Badge component for Angular. Displays additional information or status related to an element, such as notifications or counts.

Provides configuration options for alignment, size, fill, theme color, roundness, position, and cutout border.

html

<kendo-badge [size]="'large'" [themeColor]="'success'">99+</kendo-badge>

Selector

kendo-badge

Inputs

Name	Type	Default	Description
align	BadgeAlign	"{ vertical: 'top', horizontal: 'end' }"	Specifies the alignment of the Badge (see example).
cutoutBorder	boolean	false	Specifies whether to render additional cutout border around the Badge (see example).
fill	BadgeFill	solid	Specifies the appearance fill style of the Badge (see example).
position	BadgePosition	edge	Specifies the position of the Badge relative to the edge of the parent container element (see example).
rounded	BadgeRounded	medium	Specifies the roundness of the Badge (see example).
size	BadgeSize	medium	Specifies the size of the Badge (see example).
themeColor	BadgeThemeColor	primary	Specifies the theme color of the Badge. The theme color applies as background and border color, while also amending the text color accordingly (see example).