Panels

ComponentsLayout

Source: Apple Inc. Canonical content at https://developer.apple.com/design/human-interface-guidelines/panels. This file is a structured index of that content, snapshot 2025-02-02. Apple HIG text and imagery are © Apple Inc.; this repository provides organization and cross-referencing for AI agent consumption only.

Best practices

Use a panel to give people quick access to important controls or information related to the content they’re working with.

Consider using a panel to present inspector functionality.

Prefer simple adjustment controls in a panel.

Write a brief title that describes the panel’s purpose.

Show and hide panels appropriately.

Avoid including panels in the Window menu’s documents list.

In general, avoid making a panel’s minimize button available.

Refer to panels by title in your interface and in help documentation.

HUD-style panels

Prefer standard panels.

  • In a media-oriented app that presents movies, photos, or slides

  • When a standard panel would obscure essential content

  • When you don’t need to include controls — with the exception of the disclosure triangle, most system-provided controls don’t match a HUD’s appearance.

Maintain one panel style when your app switches modes.

Use color sparingly in HUDs.

Keep HUDs small.


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

Get HIG guidance in your AI

Install Apple HIG Skills and get expert 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.