New to KendoReactLearn about KendoReact Free.

Appearance

The ChipList provides a predefined set of appearance options.

Apart from the default vision of the ChipList, these alternative styling options enable you to configure each individual aspect of the appearance of a ChipList.

The following example showcases the different sizes in action:

Change Theme
Theme
Loading ...

You can also use the chip prop to pass a Chip component and apply the following options:

Chip Fill Mode

Fill modes create a certain look-and-feel of the UI and also signify hierarchy between components of the same type. The Chip allows you to set different fill modes by using the fillMode property.

Change Theme
Theme
Loading ...

Chip Border Radius

The Chip provides the rounded property that enables you to control how much border radius will apply to the rendered Chip.

Change Theme
Theme
Loading ...

Chip with SVG icons

You can render an SVG icon through the svgIcon property.

Change Theme
Theme
Loading ...

Chip with Avatars

The Chip enables you to render an avatar through the avatar property.

Change Theme
Theme
Loading ...

Chip with Icons

Font icons can be rendered through the icon property.

Change Theme
Theme
Loading ...

Chip Theme Color

The Chip allows you to set different theme colors by using the themeColor property.

Change Theme
Theme
Loading ...