Component Library

Initiates an app-specific action with customizable appearance.

A button that triggers navigation or opens a URL.

Presents a list of actions or options in a temporary overlay.

A button that presents a menu of actions when clicked.

A button that presents a menu of mutually exclusive options.

A small circular button for dismissing windows, sheets, or inline content.

A circular button with an 'i' symbol that reveals additional information.

A button with a question mark that provides contextual help.

A control that can be added to iOS/iPadOS Control Center.

Displays a scrollable collection of rows, each containing content and optional controls.

Displays content in a customizable grid or other layout arrangement.

Allows users to scroll through content that's larger than the visible area.

Indicates the current page within a series of pages and allows navigation between them.

A container for grouping controls used for data entry.

A view that displays read-only text, optionally with an icon.

A view that displays one or more lines of read-only text.

Displays data in rows and columns with support for sorting, selection, and editing.

A view that displays when content cannot be shown, such as empty states or errors.

A visual container that groups related content with an optional title.

A small widget-like element that appears on the Apple Watch face.

Premium display area at the top of the tvOS home screen when app is focused.

A dynamic display on the Lock Screen and Dynamic Island showing real-time updates.

A glanceable view that displays relevant, timely information from an app.

Shows that a task is in progress.

Shows the progress of a task with known duration.

A small indicator showing a count or status.

A visual indicator of a value within a range, like a speedometer.

Displays a series of events in chronological order.

A small visual element that shows the current state of an item.

Visual indicator showing which element has focus in the tvOS focus engine.

A container that arranges its children in a horizontal or vertical line.

A container that arranges its children in a grid pattern.

A visual separator between content.

A flexible space that expands to fill available space in stack layouts.

A stack that only creates views when they become visible.

A container that provides access to its size and position.

A container that selects the first child view that fits in available space.

A layout that enables scroll position targeting to specific views.

A view that floats near a window in visionOS, providing persistent controls or information.

A scene type that provides a fully immersive experience in visionOS.

A window style that contains 3D content with depth in visionOS.

Displays images with various scaling and positioning options.

Displays video content with playback controls.

An interactive map showing geographic data and points of interest.

A view that displays the camera preview for capturing photos or video.

A view that displays web content within an app.

Appears at the top of an app screen, below the status bar, and enables navigation through a hierarchy of content.

Appears at the bottom of an app screen and provides quick access to different sections of an app.

Contains buttons for performing actions relevant to the current screen or content.

A column that provides navigation to different sections or categories within an app.

Allows users to search through content by entering text.

A two or three-column container that manages navigation between primary content and detail views.

A view that shows or hides content based on the state of a disclosure control.

A container for hierarchical data with expandable rows.

A container that switches between multiple child views using tabs.

Displays the file system path to a file or folder as a series of clickable components.

The system-wide menu bar at the top of the screen on macOS.

A persistent icon in the macOS menu bar providing quick access to app functions.

The OLED touch strip on MacBook Pro keyboards (2016-2019 models).

Displays an important message that requires acknowledgment.

A sheet that slides up from the bottom presenting a set of actions.

A card that slides up from the bottom to present focused content or tasks.

A transient view that appears above content when activated by a control.

A view that appears on top of all other content, requiring interaction before returning.

A panel that displays detailed information and controls for selected items.

A menu that appears in response to a contextual interaction like right-click or long-press.

A dialog that asks for explicit confirmation before performing an action.

A temporary message that appears at the top of the screen.

A modal presentation that covers the entire screen.

A system-provided preview for documents, images, and other file types.

A system interface for sharing content with other apps and services.

A card that appears when someone encounters an App Clip code or link.

Displays a set of values from which the user can select one.

Allows users to select a date, time, or both.

A horizontal control made of multiple segments, each functioning as a button.

Allows users to select a value from a continuous or discrete range of values.

A control with plus and minus buttons for incrementing or decrementing a value.

A control that toggles between on and off states.

A control that toggles between two states, styled appropriately for the platform.

A square control that can be checked, unchecked, or in a mixed state.

A circular control used in groups where only one option can be selected at a time.

A control that allows users to select a color.

Allows selection of multiple dates within a calendar view.

A system-provided interface for selecting photos and videos from the user's library.

Provides access to files stored on device or in cloud services.

Input control using the Digital Crown for precise value adjustment on watchOS.

A single-line field for entering text.

A scrollable, multi-line text region for entering and displaying text.

A text field that hides entered text for sensitive information like passwords.

A multi-line text input area for longer-form content editing.

A specialized text field for entering search queries.

A text field that displays entered items as removable tokens.