← Voltar à biblioteca
Formulários

Interruptor

Switch / Toggle

Um controle que liga ou desliga uma configuração.

Exemplo didático · Experimente os controles acima

Quando usar

Alterar uma preferência que entra em vigor imediatamente.

Cuidados e acessibilidade

Use um rótulo estável e comunique o estado sem depender apenas da cor.

Partes e comportamento

Rótulo persistente e dois estados. A posição do marcador reforça o estado atual.

Não confunda

Checkbox pode compor uma seleção enviada depois. Switch normalmente aplica uma mudança imediatamente.

Exemplo de código

<label>
  <input type="checkbox" role="switch" name="notificacoes">
  Receber notificações
</label>

Trecho didático. Integre e teste no contexto do seu projeto.

Peça assim para uma IA

BIBLIOTECA UI / EXPLORAR