Chip
CoreUI PRO hexagon
Our Admin Panel isn’t just a mix of third-party components. It’s the only Bootstrap dashboard built on a professional, enterprise-grade UI Components Library. This component is part of this library, and we present only the basic usage of it here. To explore extended examples, detailed API documentation, and customization options, refer to our docs.
Explore Documentation
or
Get CoreUI PRO →
ChipBasic and outline

Chips are compact UI elements for labels, filters, and quick selections. Below are simple examples and outline variants based on the CoreUI component API.

Basic chipFrontendDesign systemDocumentation

Add.chip-outline to create a lighter, bordered appearance.

Outline chipProductMarketingAnalytics
ChipWith icons and avatars

Chips can include icons, user avatars, or avatar components to make tags easier to scan.

Team member Backlog item
Olivia Martin Ethan CarterA Account managerQ QA owner
ChipVariants and sizes

Variant classes make chips useful for filters and status states, and size modifiers help match denser or more spacious layouts.

ProductActive productPublishedLiveReviewBlocked
Small chipDefault chipLarge chipOutline primary
ChipInteractive examples

The JavaScript plugin supports selectable and removable chips usingdata-coreui-chip attributes.

SelectableSelectedRemovableDisabled
Team Alpha Filter: PriorityFilter: Ready