---
title: Cambiar
icon: toggle-on
---

<Tabs>
<Tab title="Uso">

```jsx
import { Toggle } from "twenty-ui/input";

export const MyComponent = () => {
  return (
    <Toggle
    value = {true}
    onChange = {()=>console.log('Evento onChange')}
    color="green"
    toggleSize = "medium"
    />
  );
};
```

</Tab>
<Tab title="&#x22;Props&#x22;">


| "Props"         | Tipo     | Descripción                                                                                                            | Predeterminado   |
| --------------- | -------- | ---------------------------------------------------------------------------------------------------------------------- | ---------------- |
| valor           | booleano | El estado actual del interruptor de palanca                                                                            | `falso`          |
| "onChange"      | función  | Función de retorno que se activa cuando el estado del interruptor de palanca cambia                                    |                  |
| color           | cadena   | Color del interruptor de palanca cuando                                                                                | es de color azul |
| tamañoConmutado | cadena   | Tamaño del interruptor de palanca, que afecta tanto la altura como el ancho. Tiene dos opciones: `pequeño` y `mediano` | mediano          |



</Tab>
</Tabs>
