Sidebars

On this page2 sections

Best practices

Extend content beneath the sidebar.

When possible, let people customize the contents of a sidebar.

Group hierarchy with disclosure controls if your app has a lot of content.

Consider using familiar symbols to represent items in the sidebar.

Consider letting people hide the sidebar.

In general, show no more than two levels of hierarchy in a sidebar.

If you need to include two levels of hierarchy in a sidebar, use succinct, descriptive labels to title each group.

Platform considerations

iOS

Avoid using a sidebar.

iPadOS

Consider using a tab bar first.

If necessary, apply the correct appearance to a sidebar.

macOS

Avoid stylizing your app by specifying a fixed color for all sidebar icons.

Consider automatically hiding and revealing a sidebar when its container window resizes.

Avoid putting critical information or actions at the bottom of a sidebar.

visionOS

If your app’s hierarchy is deep, consider using a sidebar within a tab in a tab bar.


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

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.