# React Chip Set Component Styling

> Learn how to customize the React Chip Set component with CSS variables and SASS for flexible spacing and seamless integration into your design system.

### CSS variables

React Chip Set supports CSS variables for easy customization. These variables are defined in CoreUI Sass and can also be overridden directly in your stylesheets or inline styles.

```scss
--cui-chip-set-gap: #{$chip-set-gap};
```

#### How to use CSS variables

```jsx
const customVars = {
  '--cui-chip-set-gap': '0.5rem',
}

return (
  <CChipSet style={customVars}>
    <CChip value="apple">Apple</CChip>
    <CChip value="banana">Banana</CChip>
  </CChipSet>
)
```

### SASS variables

```scss
$chip-set-gap: .25rem !default;
```