Toggle (also tog*le, toggled) is a word that means “switch or alternate” as in “to toggle between screens as I video chat with two friends at once.” It also refers to a kind of fastener, especially a pin passed transversely through an eye or loop in a cord or rope so as to bind it temporarily.

Toggles are a common interface element in both hardware and software. They are typically found in settings or options menus in most applications, allowing users to select the function they want by pressing on or off an option. The key difference between toggles and other interface elements such as checkboxes or radio buttons is that toggles are able to enforce a mutually exclusive state: on or off. Toggle is also commonly used to refer to a computer hardware key that switches between on and off functionality, such as the Caps Lock or Num Lock keys.

In the context of web design, it’s worth noting that toggles are notoriously difficult to use with accessibility in mind. This is because they usually rely on colors to convey meaning, and most people with red/green color blindness have difficulty distinguishing them. This is why WCAG guidelines explicitly recommend not using toggles, and instead choosing alternatives such as checkboxes or radio buttons which don’t rely on colors.

Despite their complexity, there are times when toggles make sense. But the most important thing to remember is that they should only be used when their current state is clear to users, or can be made so. Otherwise, they can be confusing and even counterproductive. And for that reason, they suck.