A chip conveys the application of its value to a section of a form. A chip is typically added to the page via the chips-combobox component.

A chip is transient; it can be completely removed from the page via the delete button.

For a static, readonly chip, the delete button can simply be omitted.

Chip Containers

When chips appear next to each other in a set, spacing and positioning adjustments should be made on the container, and if necessary, margins adjusted as such. Please review design documentation and follow the guidance here for appropriate specifications.

Here is an example of a container constrained to 300px (for vertical spacing demo reasons) that uses flex with wrapping to remove the whitespace and provide a clean set of chips (whitespace-free) within a container using the appropriate spacing conventions.