On this page2 sections

Best practices

Use a toggle to help people choose between two opposing values that affect the state of content or a view.

Clearly identify the setting, view, or content the toggle affects.

Make sure the visual differences in a toggle’s state are obvious.

Platform considerations

iOS, iPadOS

Use the switch toggle style only in a list row.

Change the default color of a switch only if necessary.

Outside of a list, use a button that behaves like a toggle, not a switch.

Avoid supplying a label that explains the button’s purpose.

macOS

Use switches, checkboxes, and radio buttons in the window body, not the window frame.

Switches

Prefer a switch for settings that you want to emphasize.

Within a grouped form, consider using a mini switch to control the setting in a single row.

In general, don’t replace a checkbox with a switch.

Checkboxes

Use a checkbox instead of a switch if you need to present a hierarchy of settings.

Consider using radio buttons if you need to present a set of more than two mutually exclusive options.

Consider using a label to introduce a group of checkboxes if their relationship isn’t clear.

Accurately reflect a checkbox’s state in its appearance.

Radio buttons

Prefer a set of radio buttons to present mutually exclusive options.

Avoid listing too many radio buttons in a set.

To present a single setting that can be on or off, prefer a checkbox.

Use consistent spacing when you display radio buttons horizontally.


For the complete guidance, including worked examples and illustrations, see the canonical page: https://developer.apple.com/design/human-interface-guidelines/toggles

Apple HIG text and imagery are © Apple Inc. This page is a structured index of Apple’s canonical documentation (snapshot 2025-02-02), provided for quick reference and AI-agent consumption — it isn’t affiliated with or endorsed by Apple. Read the original at developer.apple.com (opens in new tab).

Get HIG guidance in your AI

Install HIG Doctor and get expert Apple design guidance directly in Claude Code.

npx skills add raintree-technology/hig-doctor
Email updates aren't configured on this deployment yet. Follow the GitHub repo (opens in new tab) for updates.