Chip

Chips allow users to enter information, make selections, filter content, or trigger actions.

	primary	secondary	danger	warning	success	ai	#ff3d44	#fcf4eb
sm	Chip	Chip	Chip	Chip	Chip	Chip	Chip	Chip
md	Chip	Chip	Chip	Chip	Chip	Chip	Chip	Chip
removable	Chip	Chip	Chip	Chip	Chip	Chip	Chip	Chip

import { Chip, ChipRemoveButton } from 'swash/Chip';

() => (
  <Chip tint="primary" scale="sm">
    Chip
    <ChipRemoveButton aria-label="Remove" />
  </Chip>
);

Render as button

Use asButton to render the chip as button. This will add aria and styles attributes to the chip.

Chip

import { Chip } from 'swash/Chip';

() => (
  <Chip tint="primary" scale="sm" asButton>
    Chip
  </Chip>
);