where a normal ☑️ checkbox turns into a toggle. You don’t strictly need the browser support to get the look, as it’s weirdly easy to replicate (based on idea from Richard Keizer). But Thomas Steiner has a more comprehensive polyfill if you want it to behave more exactly […]">

Replicating a Switch Input (and Polyfill)

Chris Coyier Chris Coyier on

Safari has support for <input type="checkbox" switch> where a normal ☑️ checkbox turns into a toggle. You don’t strictly need the browser support to get the look, as it’s weirdly easy to replicate (based on idea from Richard Keizer). But Thomas Steiner has a more comprehensive polyfill if you want it to behave more exactly correctly, respecting writing-mode and accent-color and such.

Looking for a complete course on getting into web development?

Leave a Reply

Your email address will not be published. Required fields are marked *

$966,000

Frontend Masters donates to open source projects through thanks.dev and Open Collective, as well as donates to non-profits like The Last Mile, Annie Canons, and Vets Who Code.