```
### Simple inline chip group with overflow
```html
Chip one
Chip two
Chip three
```
### Simple inline chip group expanded
```html
Chip one
Chip two
Chip three
Chip four
Chip five
```
### Chip group with categories
```html
Category one
Chip one
Chip two
Chip three
```
### Chip group with categories and overflow
```html
Category one
Chip one
Chip two
Chip three
```
### Chip group with categories and overflow expanded
```html
Category one
Chip one
Chip two
Chip three
Chip four
Chip five
```
### Chip group with removable categories
```html
Category one
Chip one
Chip two
Chip three
Chip four
Chip five
Chip six
```
## Documentation
### Chip overview
A Chip is used to display items that have been filtered or selected from a larger group. They comprise of a text element and a button component that is used to remove the chip from selection. When the text overflows it is truncated using ellipses. A chip can be grouped by using the "chip-group" component.
### Chip accessibility
| Attribute | Applied to | Outcome |
| -- | -- | -- |
| `aria-label="[button label text]"` | `.pf-v5-c-button` | Provides an accessible name for the button when an icon is used instead of text. Required when an icon is used with no supporting text. |
| `aria-labelledby="[id value of .pf-v5-c-button]"` | `.pf-v5-c-button` | Gives the button an accessible name by referring to the element that provides the position of the button within a list. Required when the button is being removed. |
| `aria-hidden="true"` | `` | Hides the icon from assistive technologies. |
### Chip usage
| Class | Applied to | Outcome |
| -- | -- | -- |
| `.pf-v5-c-chip` | `