HTML + CSSToggles
Interruptor ON / OFF
Un interruptor que dice su estado, con ON y OFF deslizándose junto a la bola.
Ajustes
16px
1x
Código
<label class="uv-tt"><input type="checkbox" checked><span><em>ON</em><em>OFF</em></span></label>Prompt para IA
Pégalo en ChatGPT, Claude o Cursor y adaptará el bloque a tu proyecto con estos ajustes, aunque no uses React.
Más en Toggles
Dónde usarlo
Algunos interruptores tienen que decir lo que hacen, no solo mostrar un color. Este toggle ON/OFF encaja en paneles de administración y pantallas de facturación: el «Modo mantenimiento» de un gestor de contenidos, la «Renovación automática» de una suscripción o el «Doble factor» de los ajustes de seguridad. Nadie tiene que adivinar si el azul significa encendido.
También ayuda a quien distingue mal los colores. Deja las etiquetas en dos o tres letras, como ON y OFF o SÍ y NO; las palabras largas no caben dentro. Puedes cambiarlas directamente en el HTML.