New to Kendo UI for Angular? Start a free 30-day trial

Chip Use Cases

The Chip component can be used in different use cases as it provides a convenient option for displaying a complex piece of information in a compact form. It is especially useful for representing an entity which can be added or removed from a list, or as an action item.

Input Chips

Input chips usually represent an attribute, text, or entity and can be added or removed dynamically based on user preferences.

Example
View Source
Edit In Stackblitz  
Change Theme:

Choice Chips

Choice chips are a group of multiple chip elements containing at least two options that can be selected by the user. Depending on the selection type (single, multiple, or none), different styling is applied to indicate the user preferences.

Example
View Source
Edit In Stackblitz  
Change Theme:

Filter Chips

Filter chips represent filters for a collection and, typically, use tags or descriptive words to filter content. They are a good alternative to toggle buttons or checkboxes.

Example
View Source
Edit In Stackblitz  
Change Theme:

Action Chips

Action chips appear in a set and can trigger an action, show progress or a confirmation that are related to the primary content. An alternative to action chips are buttons, which appear in a persistent and consistent manner.

Example
View Source
Edit In Stackblitz  
Change Theme: