Vue Badge Component API

Badge API

Explore the API reference for the Vue Badge component and discover how to effectively utilize its props for customization.

On this page

jsx

import { CBadge } from '@coreui/vue-pro'

Property	Default	Type
as	`'span'`	`string`
Component used for the root node. Either a string to use a HTML element or a component.
color	-	`Color`
Sets the color context of the component to one of CoreUI’s themed colors.
position	-	`string`
Position badge in one of the corners of a link or button.
shape	-	`Shape`
Select the shape of the component.
size	-	`string`
Size the component small.
textBgColor5.0.0+	-	`Color`
Sets the component's color scheme to one of CoreUI's themed colors, ensuring the text color contrast adheres to the WCAG 4.5:1 contrast ratio standard for accessibility.
textColor	-	`TextColor`
Sets the text color of the component to one of CoreUI’s themed colors.