Check Box vs. Switch

[Lillian_Li]

Hi all,

I have a general question regarding when to use a Check Box versus a Switch. According to the Fiori guidelines:

Don’t use a switch if: It’s unclear whether the control represents a state or an action. In such cases, use a checkbox instead.

The scenario I’m dealing with is a Settings panel that contains multiple options users can turn on or off. For certain settings (e.g., Translation, Loading Indicator), enabling the option immediately displays additional content in the UI. In these cases, I believe a Switch is appropriate because the change has an instant impact on the interface.

However, for other settings, enabling them does not produce any immediate UI change; the effect only becomes visible when the user navigates to another module. This raises the question:

Should we use a mix of Checkboxes and Switches based on behavior, or is there a way to unify the design by using a single control type to keep the UI consistent and clean?

Attached is the screenshot of the mockup that I'm currently working on. You can download to review. Thank you!

[N1kh1l]

@Lillian_Li 

I think you have pretty much already summarized it.

choosing between a Check Box and a Switch (toggle) are primarily defined by the speed of effect and the context of the action.

Use a Toggle Switch When:
Instant Action: Use a switch for changes that should take effect immediately without requiring a "Save" or "Submit" button or any action Button.
System State: Ideal for turning features on or off, such as units display, Dark Mode, or notifications.
Standalone Binary Choice: Best for independent, "on/off" or "show/hide" decisions that do not depend on other settings.
High Interactivity: Switches are preferred on mobile devices due to larger touch targets and better support for haptic feedback

Use a Check Box When:
Delayed Action: Use a checkbox when the user must review their selections and click a "Submit," "Next," or "Apply" button for changes to take effect.
Multiple Selections: Best for choosing one or more options from a list (e.g., selecting multiple choice).
Nested Hierarchies: Use checkboxes when a "parent" item can select/deselect all "child" items or show an indeterminate state (e.g., some children selected).
Positive Confirmation: Recommended for standalone items that require explicit consent, such as "I agree ...etc.".

Hope this helps !

Nikhil