# EuiSlideToggleComponent

**Type:** component



Slide toggle component that can be used as a standalone toggle or within reactive forms.
Supports custom icons for on/off states and various size/variant options through BaseStatesDirective.



**Selector:** `eui-slide-toggle`

## Inputs
- **disabled**: `boolean` - Whether the toggle is disabled
- **iconSvgFillColorOff**: `string` - Fill color for the OFF state icon
- **iconSvgFillColorOn**: `string` - Fill color for the ON state icon
- **iconSvgNameOff**: `string` - Name of the icon to display when toggle is OFF
- **iconSvgNameOn**: `string` - Name of the icon to display when toggle is ON
- **id**: `string` - Unique identifier for the toggle
- **isChecked**: `boolean` - Current checked state of the toggle
- **euiPrimary**: `any` - From host directive: #[[file:BaseStatesDirective.md]]
- **euiSecondary**: `any` - From host directive: #[[file:BaseStatesDirective.md]]
- **euiInfo**: `any` - From host directive: #[[file:BaseStatesDirective.md]]
- **euiWarning**: `any` - From host directive: #[[file:BaseStatesDirective.md]]
- **euiSuccess**: `any` - From host directive: #[[file:BaseStatesDirective.md]]
- **euiDanger**: `any` - From host directive: #[[file:BaseStatesDirective.md]]
- **euiAccent**: `any` - From host directive: #[[file:BaseStatesDirective.md]]
- **euiVariant**: `any` - From host directive: #[[file:BaseStatesDirective.md]]
- **euiSizeS**: `any` - From host directive: #[[file:BaseStatesDirective.md]]
- **euiSizeM**: `any` - From host directive: #[[file:BaseStatesDirective.md]]
- **euiSizeL**: `any` - From host directive: #[[file:BaseStatesDirective.md]]
- **euiSizeXL**: `any` - From host directive: #[[file:BaseStatesDirective.md]]
- **euiSizeVariant**: `any` - From host directive: #[[file:BaseStatesDirective.md]]

## Outputs
- **slideToggleChange**: `EventEmitter` - Event emitted when toggle state changes
