React ChipList

  • Create compelling UX in your React app with this flexible component for displaying information in stylized containers called chips or pills.
  • Part of the KendoReact library along with 100+ professional UI components built with React for React, from the ground up.
  • Get started quickly with our award-winning support, detailed documentation, interactive demos and instructor-led training.


The React ChipList component takes the React Chip and provides additional functionality related to managing a collection of KendoReact Chip components. Users can add and remove items and manage currently selected items from a list of chips.

See React ChipList demo

React ChipList Component

Selection Mode

To ensure flexibility, the KendoReact ChipList component provides several selection modes. The default mode is “none”, which means no chips can be selected, yet you can enable single and multiple selection to help users manage their items individually or in bulk.

See React ChipList Selection Mode demo

React ChipList Component Selection

Data Binding

As the KendoReact ChipList component deals with displaying and manipulating a collection of items, you can bind it to different data sources. This enables React developers to utilize existing datasets generated from a database or elsewhere in a React application in order to populate the React ChipList items.

See React ChipList Data Binding demo

Disabled ChipList

The entire KendoReact ChipList component can be disabled through a single configuration option, letting developers control when an end-user can interact with the React ChipList items.

See Disabled React ChipList demo

Disabled React ChipList Component


Since the KendoReact ChipList component is built on top of the existing React Chip component every Chip displayed can be fully customized to fit any design requirements. This includes aspects like color and style of the ChipList, whether or not to display a remove icon, and adding avatars or icons as a part of the React ChipList component content.

See React ChipList Customization demo

React ChipList Component Customization

Keyboard Navigation

The KendoReact ChipList has built-in keyboard support to help navigate the application using just a keyboard.

See React ChipList Keyboard Navigation demo


One of the core aspects of KendoReact is compliance with accessibility standards. The KendoReact team understands how important accessibility is for the web and this drives the team to build accessibility into every component. The KendoReact ChipList supports Section 508, Keyboard Navigation, and WCAG 2.0 compliance with an AAA rating.

See React ChipList Accessibility demo

React ChipList Component Accessibility

Next Steps

Visit Our Demos

See KendoReact in action and check out how much it can do out-of-the-box.

See Pricing

Buy an individual license for KendoReact, or treat yourself to Kendo UI, our complete JavaScript bundle.

Start Free Trial

Try KendoReact with dedicated technical support.