Switch

Utilize o Switch para permitir que os utilizadores ativem ou desativem uma única opção ou funcionalidade. Este componente é essencial para configurações que precisam de um estado binário, como "ligado" ou "desligado", fornecendo uma forma clara e intuitiva de alternar entre dois estados opostos.

Características Principais

Alternância Binária

Permite ao utilizador alternar entre dois estados distintos, como ativado/desativado ou ligado/desligado.

Feedback Visual Imediato

Exibe claramente o estado atual (ativado ou desativado), ajudando os utilizadores a entenderem rapidamente a configuração.

Interação Simples

Facilita a mudança de estado com um único clique ou toque, proporcionando uma experiência de utilizador intuitiva.

Exemplo de Utilização

• Configurações de preferências, como ativar notificações ou modos de exibição.
• Controlo de funcionalidades, como ligar ou desligar uma função específica em uma aplicação.
• Painéis de administração para gerir o status de serviços ou opções.

Incorpore o Switch sempre que precisar oferecer uma forma simples e eficaz de alternar entre dois estados, melhorando a clareza e a usabilidade da interface.

                                                    
<label class="gra-switch">
    <input type="checkbox">
    <span class="slider round"></span>
</label>

<label class="gra-switch disabled">
    <input type="checkbox" disabled>
    <span class="slider round"></span>
</label>

<label class="gra-switch disabled">
    <input type="checkbox" disabled checked>
    <span class="slider round"></span>
</label>

<label class="gra-switch error">
    <input type="checkbox">
    <span class="slider round"></span>
</label>