Chip

The v-chip component is used to convey small pieces of information. Using the close property, the chip becomes interactive, allowing user interaction.

Usage

Chips come in 4 primary variations. Regular, with icon, with portrait and closeable.

API

v-chip

Examples

Colored

Any color from the Material Design palette can be used to change a chips color.


Icon

Chips can use text or any icon available in the Material Icons font library.


Outline

Outlined chips inherit their border color from the current text color.


Label

Label chips use the v-card border-radius.


Closable

Closable chips can be controlled with a v-model. Listen to the input event if you want to know when a chip has been closed.

In selects

Selects can use chips to display the selected data.