Toggle Button

Toggle button is a two-state button.

Behaviours & States


Toggle Buttons have the ability to reflect an on/off state. The "selected" state indicates an option is on where the "normal" state is off.


Mutiple Toggle Buttons can be used in a row and may be grouped. When grouped, only one Toggle Button may be selected at a time. When the user selects a different Toggle Button, the previous selection is deselected. For example "Turn WiFi OFF/Turn WiFi ON" is more understandable than "WiFi On/WiFi Off".


Optional tool tips can be applied to toggle buttons to clarify the action when pressed.


Normal (up/unpressed) There has been no interaction with the Button but it is available for use.
Focus (hover) The Button has the current focus from the remote and is ready to be selected. This state may be animated.
Selected (down/pressed) The Button is not focused on, but resulted in an action which changes state. Toggle in an on state would be in the selected state.
Deactivated (disabled) The Button cannot be selected.