Component · Forms

Chip

a compact descriptor — a filter, a selection, or a removable token.

Example

Playground

type
size
 

Where available

React
Angular
Web Components
Blazor
Tokens

Using it

the same component, named idiomatically per target. one CSS contract underneath, so they render identically.

TargetReferencePackage
React <Chip> @design-foundry/lucent-react
Angular <lucent-chip> @design-foundry/lucent
Web Components <lucent-chip> @design-foundry/lucent-wc
Blazor <LucentChip> DesignFoundry.Lucent

API

PropTypeDefaultDescription
type default | active | tag | action default chip role.
label string chip text.
size xs | sm | md | lg md control density.