# gds-divider

**Class**: `GdsDivider`

**Tag**: `<gds-divider>`


## Properties

| Name | Type | Default | Description |
|------|------|---------|-------------|
| `color` | `string \| undefined` | `-` | Controls the color property of the divider. Supports all the color tokens from the design system.  You can apply color like this:  ```html <gds-divider color="interactive"></gds-divider> ``` |
| `size` | `string \| undefined` | `-` | Controls the size property of the divider. Supports all the space tokens from the design system.  You can apply size like this:  ```html <gds-divider size="2xl"></gds-divider> ```  The above example will apply the size style of 2xl. |
| `opacity` | `string \| undefined` | `-` | Controls the opacity property of the divider. Supports all the opacity tokens from the design system.  You can apply opacity like this:  ```html <gds-divider opacity="0.2"></gds-divider> ``` The above example will apply the opacity style of base400. |
| `role` | `string \| null` | `-` | Use the role attribute primarily if you only want the divider to be a visual element.  ```html <!-- This divider will not be announced as a separator or thematic break --> <gds-divider role="presentation"></gds-divider> ``` |
| `width` | `string \| undefined` | `-` | Style Expression Property that controls the `width` property. Supports space tokens and all valid CSS `width` values. |
| `'min-width'` | `string \| undefined` | `-` | Style Expression Property that controls the `min-width` property. Supports space tokens and all valid CSS `min-width` values. |
| `'max-width'` | `string \| undefined` | `-` | Style Expression Property that controls the `max-width` property. Supports space tokens and all valid CSS `max-width` values. |
| `'inline-size'` | `string \| undefined` | `-` | Style Expression Property that controls the `inline-size` property. Supports space tokens and all valid CSS `inline-size` values |
| `'min-inline-size'` | `string \| undefined` | `-` | Style Expression Property that controls the `min-inline-size` property. Supports space tokens and all valid CSS `min-inline-size` values. |
| `'max-inline-size'` | `string \| undefined` | `-` | Style Expression Property that controls the `max-inline-size` property. Supports space tokens and all valid CSS `max-inline-size` values. |
