Colored Chips
When appropriate, use the color prop to apply status or brand colors to a chip.
Important Notes:When using status chips, it is recommended to append an appropriate icon in front of the text.When using branded chips, always make sure a chip has good contrast with the page background. For example, do not use navy colored chip on a navy background.
Demo
Status Colors
Error
Warning
Success
Selective Brand Colors
navy
teal
orange
yellow
wine
pink
berry
violet
gray
Twig
{% include '@bolt-components-chip/chip.twig' with {
text: 'Colored chip',
color: 'teal',
} only %}