#### Default Chips

Helps you represent simple data with Various options.you can create a chip by using `.chip` and `.chip-body`. to add avatar use class `.avatar` inside `.chip-body`. use class `.chip-text` for chip text.

Basic Chip
LD
Avatar Text
Avatar Icon
Avatar Image
Chip Closeable

#### Colors

use class `.chip-{color-name}` with `.chip` to change background color of chip.

Primary chip
LD
Avatar Text
Avatar Icon
Avatar Image
Avatar Closeable

#### Colored Avatar

You can change background color of avatar by using `.bg-{color-name}` with `.avatar`

VS
Avatar Text
HT
Avatar Text
Avatar Text
Avatar Text
Avatar Text

#### Icons

To add icons in your chips wrap them inside `.avatar`

Default chip
Share Icon
Mail Icon
Block Icon
Battery Icon
Edit Icon

#### Closeable

To make your chip closeable use class `.chip-closeable`

Dribble
Github
Behance
Vue Js
VueSax

#### Customized Closeable Icon

You can change closeable icon by wrapping your preferred icon in `.chip-closeable`

Dribble
Github
Behance
Vue Js
VueSax