1. Basic Forms
  2. Switch


Tailwind CSS Switch

A toggle is used to view or switch between enabled or disabled states.

Attention needed

By default Preline UI uses Tailwind CSS Forms plugin. Don't forget to install it!

Basic usage


The default form of a toggle.

With description

The basic usage with description.


Disabled switch.

With tooltip

In this example we have added a tooltip to the switcher.


Switches stacked small to large sizes.

Validation states

It provides valuable, actionable feedback to your users with HTML5 form validation.