Please wait...

Chips

  1. Home
  2. Advance UI

Chips

Chips can be used to represent small blocks of information. They are most commonly used either for contacts or for tags.

Contact Chip

To create a contact chip just add an img inside.
Contact Person John Doe
Contact Person Lucy Doe
Contact Person John Doe

Tag Chip

To create a tag chip just add a close icon inside with the class close.
Tag close
Icon close
Font close
Table close
Label close

Contact Chip With Material Colors

You can also style it easily with class ( e.g. .bg-red, bg-green ) etc.
Contact Person John Doe
Contact Person Lucy Doe
Contact Person John Doe

Tag Chip With Material Colors

You can also style it easily with class ( e.g. .bg-red, bg-green ) etc.
Tag close
Icon close
Font close
Table close
Label close

Chip With Javascript Plugin Usage

To add tags, just enter your tag text and press enter. You can delete them by clicking on the close icon or by using your delete button.

Set initial tags.

Appleclose
Microsoftclose
Googleclose

Use placeholders and override hint texts.