Toggle

A Toggle is used to turn something on or off.

Overview / Hero - KL

Anatomy

A Toggle consists of a toggle button (sometimes also referred to as a switch) and an optional action label.

Overview / Anatomy - KL

When used in the context of a digital product, there should always be an accompanied label or text describing what the user can turn on or off, as demonstrated below. This is not part of the component but should be taken into the account of the consumer's side.

Overview / Anatomy 2 - KL

States

Overview / States - KL