---
title: "Switch"
description: "Toggle switch input."
section: "Libraries"
group: "UI components"
order: 519
---

## Usage

```tsx
import { Label, Switch } from "@aeontel/ui";

<div className="flex items-center gap-2">
  <Switch id="notifications" checked={on} onCheckedChange={setOn} />
  <Label htmlFor="notifications">Email notifications</Label>
</div>;
```

## Exports

### `Switch`

On / off toggle switch.

```ts
Switch(props: SwitchPrimitive.Root.Props & Pick<SwitchBaseProps, "size">): JSX.Element
```

**Props**

| Prop    | Type                             | Default     | Description |
| ------- | -------------------------------- | ----------- | ----------- |
| `size?` | `"default" \| "sm" \| undefined` | `"default"` |             |