form

The indispensable form controls

switch




                    

                        
                       <div class="field">
						  <input id="switchExample" type="checkbox" name="switchExample" class="switch" checked="checked">
						  <label for="switchExample">Switch example</label>
						</div>
                        

                    
                    

Use is-rtl to display a right-to-left design of checkbox (text at left)


                    

                        
                      <div class="field">
						  <input id="switchRtlExample" type="checkbox" name="switchRtlExample" class="switch is-rtl" checked="checked">
						  <label for="switchRtlExample">Switch example</label>
						</div>
                        

                    
                    

Don't forget to set the id attribute on input and the for attribute on label with the same value to get it work. This will link the label to the checkbox and then handle the click.




Colors




Styles - Thin




Styles - Rounded




Styles - Outlined




Styles - Mixed




States - Disabled







Niche Templates

Joo - Niche Multi-Purpose HTML Template
Creative 01
View more
Joo - Niche Multi-Purpose HTML Template active
Corporate 01
Joo - Niche Multi-Purpose HTML Template
Burger Restaurant
View more
Joo - Niche Multi-Purpose HTML Template
Wedding
View more
Joo - Niche Multi-Purpose HTML Template
Corporate 02
View more
Joo - Niche Multi-Purpose HTML Template
Barber Shop
View more
Joo - Niche Multi-Purpose HTML Template
Logistics Cargo
View more
Joo - Niche Multi-Purpose HTML Template
Restaurant 01
View more
Joo - Niche Multi-Purpose HTML Template
Wedding Planner
View more
Joo - Niche Multi-Purpose HTML Template
Logistics Cargo 02
View more
Joo - Niche Multi-Purpose HTML Template
Creative 02
View more
Joo - Niche Multi-Purpose HTML Template
Bridal Dresses
View more
Joo - Niche Multi-Purpose HTML Template
Coming Soon
View more
Joo - Niche Multi-Purpose HTML Template
Creative 03
View more