🔔 Alert..!! Get 2 Month Free Cloud Hosting With $200 Bonus From Digital Ocean ACTIVATE DEAL

A simple and super light Vue.js component for simple toggle button (switch) with a nice smooth transition.

Form

Documentation

Vue Simple Toggle (Switch)

A simple and super light Vue.js component for simple toggle button (switch) with a nice smooth transition.

No dependencies. No sass/less compilation. Very easy to use :).


How it looks DEMO

Installation

npm install vue-libs-simple-toggle --save

Basic Usage

import Toggle from 'vue-libs-simple-toggle';  new Vue({      components: {         Toggle     },      data () {         return {             currentState: true         }     } };
<toggle v-model="currentState"></toggle> 

Customization

Override the relevant classes to customize it. For example, to make it blue instead of green:

    .vue-libs-simple-toggle input:checked + .slider {         background-color: blue!important;     }     .vue-libs-simple-toggle input:focus + .slider {         box-shadow: 0 0 1px blue!important;     }

You May Also Like