---
path: components/chip/usage
title: Usage
position: 2
seo_title: Guidelines for Using the Chip Component
seo_description: Get the knack of the Telerik and Kendo UI Chip and learn how to
  use and implement the component by following the instructions and
  recommendations in the user guidelines created by our designers.
---

## Usage Guidelines

The Telerik and Kendo UI Chip requires you to follow some basic principles when using the component.

### Label Width

Although the Chip component can contain larger chunks of text, try to keep its content clear, compact, concise, and as short as possible. The goal of the Chip is to be compact, so be mindful of its placement when adding textual content.

<DosDonts>
<Do description="Keep the label of the Chip as short as possible.">![A Telerik and Kendo UI Chip component consisting of two short words.](images/components-chip-usage-label-width-do.png "Use short and clear words for the label of the Telerik and Kendo UI Chip component.")</Do>
<Dont description="Avoid assigning longer and long-winded labels.">![A Telerik and Kendo UI Chip component consisting of a five-word sentence with a period in the end.](images/components-chip-usage-label-width-dont.png "Do not use long, tedious, and excessive descriptions for the label of the Telerik and Kendo UI Chip component.")</Dont>
</DosDonts>


### Fill Modes

The Telerik and Kendo UI Chip supports the solid and outline fill modes. The two imply different emphases of the meaning and aim to blend seamlessly with other components in the context of the user interface.

<DosDonts>
<Do description="Use different fill modes for the Chip depending on the context.">![Two Telerik and Kendo UI Chips within a single component, both using the same solid fill mode.](images/components-chip-usage-filll-mode-do.png "Apply the fill mode that corresponds to the emphasis and the context in which the Telerik and Kendo UI Chip component is used.")</Do>
<Dont description="Avoid mixing Chip components with different fill modes within the same group or component.">![Two Telerik and Kendo UI Chips within a single component, each using a different fill mode.](images/components-chip-usage-filll-mode-dont.png "Do not use Telerik and Kendo UI Chip components of different fill modes within a single component or within the same group of components.")</Dont>
</DosDonts>


### Size

Depending on the purpose of the component, the Chip enables you to apply the small, large, or the default medium sizing option to smoothly fit into the UI.

<DosDonts>
<Do description="Use the size of the chips in accordance with the size of the components they are connected to or are part of.">![Two Telerik and Kendo UI Chips located in a single component and of the same size.](images/components-chip-usage-size-do.png "")</Do>
<Dont description="Avoid combining Chips of different sizes within a single component.">![Two Telerik and Kendo UI Chips located in a single component but using different sizes.](images/components-chip-usage-size-dont.png "Do not apply different sizes to the Telerik and Kendo UI Chip within the context of the same container component.")</Dont>
</DosDonts>