The design for a project I was developing at work required multiple pill slider toggles, some two-state and others three-state. This is pretty simple with vanilla JavaScript and modern CSS, so I prototyped it in CodePen before copying to the production code.

Requirements

How it works

CSS

JavaScript

See the Pen Toggle Switch by Brent Danley (@brentdanley) on CodePen.