Skip to content

Chip

Source page in Figma: Checkbox, Radio, Chip · 4 component sets · 0 standalone components

Index: ../component-registry.md · Workflows: ../workflows.md

NameKeyVariantsProperties
.Chip select/Sizeceb5e058fd4d2f934f82b59238cb800644a8d39948✏️ Label#19457:0=text
✏️ Desrc.#24049:0=text
Description#32633:0=bool (default True)
☑️ Check item#34282:0=bool (default True)
Icon#34291:0=bool (default True)
🔄 Icon#34291:49=instance-swap
Type=checkbox | .Radio (default checkbox)
Layout=Left check | Right check (default Left check)
Size=md | lg | 4xl (default md)
Align=Left | Center (default Left)
Radius=Block | Round (default Block)
.Chip/Sizedafc8cf8a1c944497e08a2626735edfa9a4d55458✏️ Text#25222:0=text
Left icon#25222:1=bool (default True)
🔄 Left icon#25222:2=instance-swap
Close button#25222:3=bool (default True)
Size=Large | Small | Supper | XLarge (default Large)
Type=Text | Input (default Text)
Chipc5e584409bd8f67f12380a0320a8a3e0473501f348Active=On | Off (default Off)
State=default | disabled | hover (default default)
Size=Large | Small | Supper | XLarge (default Large)
Color=Blue | Green (default Blue)
Chip selectec0d0ce2f97064c968208c1781563c8aa25f22dc96Type=Checkbox | radio (default Checkbox)
State=Hover | Disable | Default (default Default)
Checked=True | False (default False)
Color=Brand | Neutral (default Brand)
Width mode=Fill | Hug (default Fill)
Transparent=no | yes (default no)