#toggle CSS effects

5 free, pure-CSS effects match the "toggle" tag. Each is copy-ready and needs no library or build step.

Clicking the avatar flips the presence label between available and do not disturb.

Every header carries a small metal switch that slides over as the row opens.

Real checkboxes become sliding switches and every enabled flag tints its own row through has.

A hidden checkbox swaps the whole chart between centimetres and inches with no script at all.

Effects tagged #toggle