# Chips
The v-chip component is used to convey small pieces of information. Using the close property, the chip becomes interactive, allowing user interaction. This component is used by the v-chip-group for advanced selection options.
# Usage
Chips come in the following variations: closeable, filter, outlined, pill. The default slot of v-chip will also accept avatars and icons alongside text.
# API
# Examples
# Props
# Closable
Closable chips can be controlled with a v-model. You can also listen to the click:close event if you want to know when a chip has been closed."
# Colored
Any color from the Material Design palette can be used to change a chips color.
# Draggable
draggable v-chip component can be dragged by mouse.
# Filter
v-chip component has filter option which shows an additional icon to you if chip is active. It can be customized using filter-icon.
# Label
Label chips use the v-card border-radius.
# No ripple
v-chip can be rendered without ripple if ripple prop is set to false.
# Outlined
Outlined chips inherit their border color from the current text color.
# Sizes
v-chip component can have various sizes from x-small to x-large.
# Events
# Action chips
Chips can be used as actionable items. Provided with a click event, the chip becomes interactive and can invoke methods.
# Slots
# Icon
Chips can use text or any icon available in the Material Icons font library.
# Misc
# Custom list
In this example we opt to use a customized list instead of v-autocomplete. This allows us to always display the options available while still providing the same functionality of search and selection.
# Expandable
Chips can be combined with v-menu to enable a specific set of actions for a chip.
# Filtering
Chips are great for providing supplementary actions to a particular task. In this instance, we are searching a list of items and collecting a subset of information to display available keywords.
# In selects
Selects can use chips to display the selected data. Try adding your own tags below.