Switch - CSS Component ​

The Switch component can be used imported from:

Playground ​

Construction ​

Common API

For the basics, check the common specifications.

The CSS component uses a <input type="checkbox"> tag or a <label> tag, depending if you want to insert a describing set for the input.

z-switch ​

The z-switch parameter is the main parameter used to render the switch component.

Invalid ​

The input can be set as invalid using the aria-invalid in the input:

help-text ​

The input can have a help-text. This only work when label if provided:

Browser support ​

Detected engine:  

  • Chromium

  • Webkit

  • Gecko

HTML Examples ​

CodeSandbox example ​