#### Avatar

Often you need to add an user's avatar to your app. In order to make this we have the component. Note: you have to use inline attributes for avatar image size.

Use below mentioned code to create an avatar.

        <div class="avatar">
        <span class="avatar-content"><i class="avatar-icon feather icon-github"></i></span>
      </div>

Avatar Type | Class | Description
--- | --- | ---
Basic | `.avatar.bg-*` | Use any template color from COLOR PALETTE that you like to add for avatar.
Avatar Sizes | `.avatar-{sm|lg|xl}` | Diffrent sizes for avatar.
Avatar Status | `.avatar-status-{online | offline | away | busy}` | Adds little element to avatar with color according to status.

Referrals :

Type | URL
--- | ---
Template Page | https://pixinvent.com/demo/vuexy-html-bootstrap-admin-template/html/ltr/vertical-menu-template/ex-component-avatar.html

#### Chips

Chips are compact elements that represent an input, attribute, or action.

Use below mentioned code to create a chip.

      <div class="chip">
      <div class="chip-body">
        <div class="avatar">
          <div class="avatar-content">
            LD
          </div>
        </div>
        <span class="chip-text">Avatar Text</span>
      </div>
    </div>

Chip Type | Class | Description
--- | --- | ---
Basic | `.chip.chip-*` | Use any template color from COLOR PALETTE that you like to add for chip.
Avatar | `.avatar` | Adds avatar inside chip.
Closeable | `.chip-closeable` | creates a closeable chip.

Referrals :

Type | URL
--- | ---
Template Page | https://pixinvent.com/demo/vuexy-html-bootstrap-admin-template/html/ltr/vertical-menu-template/ex-component-chips.html

#### Divider

Divide text or section components with some great features and quick to implement.

Use below mentioned code to create a divider.

        <div class="divider">
        <div class="divider-text">My Text</div>
      </div>

Divider Type | Class | Description
--- | --- | ---
Basic Divider | `.divider` | Creates a divider
Divider Text | `.divider-text` | Adds text between divider.
Position | `.divider-{left|left-center|right|right-center}` | Changes divider text position.
Colors | `.divider-*` | Changes divider color.
Style | `.divider-{dotted | dashed}` | Changes divider style.

Referrals :

Type | URL
--- | ---
Template Page | https://pixinvent.com/demo/vuexy-html-bootstrap-admin-template/html/ltr/vertical-menu-template/ex-component-divider.html