New to Kendo UI for AngularStart a free 30-day trial

ChipComponent

Updated on Feb 16, 2026

Displays a Chip that represents an input, attribute, or action.

html
<kendo-chip label="Chip Label"></kendo-chip>

Selector

kendo-chip

Inputs

NameTypeDefaultDescription

avatarSettings

ChipAvatarSettings

Use these settings to render an avatar within the Chip.

disabled

boolean

false

If set to true, the Chip is disabled.

fillMode

ChipFillMode

Sets the background and border styles of the Chip. See Chip Appearance. The default value is set by the Kendo theme.

icon

string

Defines the name for an existing icon in a Kendo UI theme. The icon is rendered inside the Chip by a span.k-icon element.

iconClass

string

Defines a CSS class, or multiple classes separated by spaces, applied to a span element. Use the iconClass to add custom icons.

label

string

Sets the label text of the Chip.

removable

boolean

false

Specifies if the Chip is removable. If set to true, the Chip renders a remove icon.

removeIcon

string

Specifies a custom remove font icon class to render when the Chip is removable. see example

removeSvgIcon

SVGIcon

Specifies a custom remove SVG icon to render when the Chip is removable.

rounded

ChipRounded

Sets the border radius of the Chip. See Chip Appearance. The default value is set by the Kendo theme.

selected

boolean

false

Specifies the selected state of the Chip.

size

ChipSize

Sets the padding of the Chip. See Chip Appearance. The default value is set by the Kendo theme.

svgIcon

SVGIcon

Defines an SVGIcon to render inside the Chip using a KendoSVGIcon component.

themeColor

ChipThemeColor

Sets a predefined theme color for the Chip. The theme color applies as a background and border color and adjusts the text color. See Chip Appearance. The default value is set by the Kendo theme.

Events

NameTypeDescription

contentClick

EventEmitter<ChipContentClickEvent>

Fires when the user clicks the content of the Chip.

remove

EventEmitter<ChipRemoveEvent>

Fires when the user clicks the remove icon of the Chip.

Methods

blur

Blurs the Chip component.

focus

Focuses the Chip component.

In this article
SelectorInputsEventsMethods
Not finding the help you need?
Contact Support