# Chip

Source: https://design.ritchiebros.com/components/data-display/chip/

Chips represent a set of interactive keywords that help label, organize, and categorize objects. People can add or remove them.

## Figma

The Figma reference for **Chip** will appear here once the design link is added.

## Storybook

Interactive examples for **Chip** will render here once the Storybook link is wired in.

## Best practices

- Present chips close to or within the input control used to add and remove them.
- Keep chip labels short and scannable.
- Make the remove affordance obvious for chips that can be deleted.

## Accessibility

- The remove control is a button with a label so assistive technology announces which chip will be removed.
- It’s reachable with Tab and activated with Enter or Space.
- When a chip is removed, move focus to the next logical element so keyboard users aren’t stranded.

## Related components

- [Badge](https://design.ritchiebros.com/components/data-display/badge/)
- [TextField](https://design.ritchiebros.com/components/inputs/text-field/)
