.switch

There are two sets of modifications:
1) <input> tag vs <div> with classes
2) Single vs. multiple choice.

Scroll down to see.

.switch--on-inputs — based on <input>

.switch--single (radio buttons)

.switch--multiple (checkboxes)

.switch--on-classes — based on <div>
(Add piece of JS to toggle classes)

.switch--single

.switch--multiple

.switch--airy

In this skin all items are squared by default. Width can be stretch using
.switch__item--free-width modifier: