Latest Additions

Button Sizing

The preferred sizing behavior of buttons in the view hierarchy.

TabSection

A container that you can use to add hierarchy within a tab view.

TabBarOnlyTabViewStyle

A tab view style that displays a tab bar when possible.

TabView

Creates Tabs with title, image, systemImage and custom Label.

Search Tab Role

On Liquid Glass, this tab is placed in its own group. In left-to-right (LTR) layouts, it will always appear on the right side of the TabView.

GroupedTabViewStyle

A tab view style that displays a tab bar that groups its tabs together.

PageTabViewStyle

A TabViewStyle that displays a paged scrolling TabView.

VerticalPageTabViewStyle

A TabViewStyle that displays a vertical TabView interaction and appearance.

SidebarAdaptableTabViewStyle

A tab bar style that adapts to each platform.

Tab View Customization Behavior

Configures the customization behavior of customizable tab view content.

Tab View Customization

Specifies the customizations to apply to the sidebar representation of the tab view.

Tab View Side Bar Footer

Adds a custom footer to the sidebar of a tab view.

Tab View Side Bar Bottom Bar

Adds a custom bottom bar to the sidebar of a tab view.

Default Adaptable Tab Bar Placement

Specifies the default placement for the tabs in a tab view using the adaptable sidebar style.

Tab Bar Section Actions

Adds custom actions to a tab section.

Tab View Side Bar Header

Adds a custom header to the sidebar of a tab view.

Tab Badge

Generates a badge for a tab from an integer value.

Hidden Index PageTabViewStyle

A TabViewStyle that displays a paged scrolling TabView with a hidden index.

Value Tab View

Creates a tab view that uses a builder to create and specify selection values for its tabs.

WheelPickerStyle

A picker style that presents the options in a scrollable wheel that shows the selected option and a few neighboring options.

SegmentedPickerStyle

A picker style that presents the options in a segmented control. Use this style when there are two to five options. Consider using menu when there are more than five options.

PalettePickerStyle

A picker style that presents the options as a row of compact elements. When used outside of menus, this style is rendered as a segmented picker. If that is the intended usage, consider segmented instead.

RadioGroupPickerStyle

A picker style that presents the options as a group of radio buttons.

NavigationLinkPickerStyle

A picker style represented by a navigation link that presents the options by pushing a List-style picker view.

MenuPickerStyle

A picker style that presents the options as a menu when the user presses a button, or as a submenu when nested within a larger menu.

InlinePickerStyle

A PickerStyle where each option is displayed inline with other views in the current container.

Wheel Picker Item Height

Sets the default wheel-style picker item height.

Horizontal Radio Group Layout

Sets the style for radio group style pickers within this view to be horizontally positioned with the radio buttons inside the layout.

Custom Value Label Picker

Creates a picker that generates its label from a localized string key and accepts a custom current value label.

Multiple Sources Picker

Creates a picker that updates the selected property for all sources.

Picker

Creates a pickers with title, image, systemImage, and custom label.

Picker Section

A Section inside a Picker

Picker Divider

A Picker with a Divider

Navigation Split View Container Background

A background placement behind the content of a NavigationSplitView.

Navigation Container Background

Sets the container background of the enclosing container using a view.

Uniform Concentric Rectangle

Create a rectangle with the same corner style set on four corners.

Concentric Rectangle

A concentric rectangle whose corner radii are defined from the same circle center as its parent element. The outermost parent is the device frame.

Custom Label

Creates a label with a custom title and icon.

Image Label

Creates a label with an icon image and a title generated from a localized string.

System Image Label

Creates a label with a system icon image and a title generated from a localized string.

Label Styles

Sets the style for labels within this view.

Custom Labeled Content

Creates a standard labeled element, with a view that conveys the value of the element and a label.

Formatted Labeled Content

Creates a labeled informational view from a formatted value.

Labeled Content

Creates a labeled informational view.

Disable Sheet Dismiss Swipe

Conditionally prevents interactive dismissal of presentations like popovers, sheets, and inspectors. Dragging the sheet is still possible to a limited extent, as shown in the screenshot, but it will never be dismissed.

Page Screen Sheet Size

On devices smaller than a page of paper, such as iPhone, Apple Watch, and 8" or 11" iPads, the sheet fills the entire height and, unlike the default sheet on iPad, the full width. On macOS, .page behaves like .fitted.

Fitted Sheet Sizing

Sets the sizing of the containing presentation. This does not have any effect on smaller devices like iPhone and Apple Watch. On macOS, fitted is the default.

Sheet Corner Radius

Requests that the presentation have a specific corner radius.

Prioritize Sheet Content Scrolling

Configures the behavior of swipe gestures on a presentation. PresentationContentInteraction.scrolls prioritizes scrolling the content over resizing the sheet.

Sheet Background Interaction

Controls whether people can interact with the view behind a presentation.

Sheet Background

Sets the presentation background of the enclosing sheet using a shape style.

Sheet Drag Indicator Visibility

Sets the visibility of the drag indicator on top of a sheet.

Sheet Size

Sets the available detents for the enclosing sheet.

Item Sheet

Presents a sheet using the given item as a data source for the sheet’s content. On watchOS, sheets are displayed as fullScreenCover.

Boolean Sheet

Presents a sheet when a binding to a Boolean value that you provide is true. On watchOS, sheets are displayed as fullScreenCover.

Role Button With Default Label

Creates a button that displays a default label.

SliderTickContentForEach

A type of slider content that creates content by iterating over a collection.

Outline Group

A structure that computes views and disclosure groups on demand from an underlying collection of tree-structured, identified data.

Disclosure Group

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

Edit Button

A button that toggles the edit mode environment value.

Section Index Label and Visibility

Sets the label that is used in a section index to point to this section, typically only a single character long. Changes the visibility of the list section index.

Move Disabled

Adds a condition for whether the view’s view hierarchy is movable.

Delete Disabled

Adds a condition for whether the view’s view hierarchy is deletable.

Refreshable List

Marks this view as refreshable.

Swipe Action

Adds custom swipe actions to a row in a list.

List Badge Prominence

Specifies the prominence of badges created by this view.

List Badge

Generates a badge for the view from an integer value.

List Row Background

Places a custom background view behind a list row item.

Hidden List Row Separator

Sets the display mode to hidden for the separator associated with this specific row.

Hidden List Section Separator

Sets whether to hide the separator associated with a list section.

List Section Separator Tint

Sets the tint color associated with a section.

List Row Separator Tint

Sets the tint color associated with a row.

List Background Prominence

The prominence of the background underneath views associated with this environment.

List Item Tint

Sets a fixed tint color for content in a list.

List Section Margins

Set the section margins for the specific edges.

SidebarListStyle

The list style that describes the behavior and appearance of a sidebar list.

InsetGroupedListStyle

The list style that describes the behavior and appearance of an inset grouped list.

InsetGroupedListStyle

The list style that describes the behavior and appearance of an inset grouped list.

InsetListStyle

The list style that describes the behavior and appearance of an inset list.

EllipticalListStyle

The list style that describes the behavior and appearance of an elliptical list.

CarouselListStyle

The carousel list style.

BorderedListStyle

The list style that describes the behavior and appearance of a list with standard border.

Compact List Section Spacing

Compact spacing between sections

Custom List Section Spacing

Sets the spacing between adjacent sections in a List to a custom value.

List Row Spacing

Sets the vertical spacing between two adjacent rows in a List.

Default Min List Header Height

The default minimum height of a header in a list.

Default Min List Row Height

The default minimum height of rows in a list.

List Row Insets

Applies an inset to the rows in a list.

Increased Header Prominence

Sets the header prominence to increased for this view.

Text Format

Creates a text view that displays the formatted representation of a nonstring type supported by a corresponding format style.

ControlSize

A control version that is the default size

Glass Effect Container

A view that combines multiple Liquid Glass shapes into a single shape that can morph individual shapes into one another

ContainerRelativeShape

A shape that is replaced by an inset version of the current container shape. If no container shape was defined, is replaced by a rectangle

Glass Button Styles

A button style that applies glass border artwork based on the button’s context

ToolbarSpacer

A standard space item in toolbars

ToolbarItem Shared Background Visibility

Controls the visibility of the glass background effect on items in the toolbar. In certain contexts, such as the navigation bar on iOS and the window toolbar on macOS, toolbar items will be given a glass background effect that is shared with other items in the same logical grouping

Title Toolbar Item Placement

Places content in the title area

Custom Slider Ticks

Creates a slider to select a value from a given range, subject to a step increment, which displays the provided labels and customizable ticks.

Hard ScrollEdgeEffect

A scroll edge effect with a hard cutoff and dividing line

Navigation Subtitle

Configures the view’s subtitle for purposes of navigation, using a localized string

Background Extension Effect

Adds the background extension effect to the view. The view will be duplicated into mirrored copies which will be placed around the view on any edge with available safe area. Additionally, a blur effect will be applied on top to blur out the copies

Glass effect

Applies the Liquid Glass effect to a view

TabView Bottom Accessory Placement

A placement of the bottom accessory in a tab view. You can use this to adjust the content of the accessory view based on the placement

Hide Tab Bar On Scroll Down

Minimize the tab bar when downwards scrolling starts. Minimizing is supported for tab bars on only iPhone

Bottom Accessory

A modifier to place content above the tabs

ProgressView

The different ProgressView initializers

ProgressView Colors

Customizing the colors of the ProgressView

CircularProgressViewStyle

The style of a progress view that uses a circular gauge to indicate the partial completion of an activity

LinearProgressViewStyle

A progress view that visually indicates its progress using a horizontal bar

Divider

A visual element that can be used to separate other content

Divider Height

Customizing the height of the Divider

Divider Color

Customizing the color of the Divider

Vertical Divider

A vertical visual element that can be used to separate other content

HelpLink

A button with a standard appearance that opens app-specific help documentation

TextFieldLink

A control that requests text input from the user when pressed

Custom Preview Item ShareLink

Creates an instance, with a custom label, that presents the share interface

ShareLink

A view that controls a sharing presentation

Link

A control for navigating to a URL

Stepped Min Max Label Slider

Creates a slider to select a value from a given range, subject to a step increment, which displays the provided labels

Stepped Slider

Creates a slider to select a value from a given range, subject to a step increment

Slider

Creates a slider to select a value from a given range

Slider Color

Customizing the color of the slider

Future DatePicker

Creates an instance that selects multiple dates on or after some start date

MultiDatePicker

A control for picking multiple dates.

Hour Minute Seconds DatePicker

A DatePicker for just hour, minute, and second.

Future DatePicker

Creates an instance that selects a Date in a closed range

DatePicker Components

A date picker with only one displayed component

DatePicker

Creates an instance that selects a Date with an unbounded range

DatePicker Colors

Customizing the colors of the date picker

FieldDatePickerStyle

A date picker style that displays the components in an editable field

StepperFieldDatePickerStyle

A system style that displays the components in an editable field, with adjoining stepper that can increment/decrement the selected component

WheelDatePickerStyle

A date picker style that displays each component as columns in a scrollable wheel

GraphicalDatePickerStyle

A date picker style that displays an interactive calendar or clock

ControlGroup

Creates a new ControlGroup with the specified children

PaletteControlGroupStyle

A control group style that presents its content as a palette.

NavigationControlGroupStyle

The navigation control group style

MenuControlGroupStyle

A control group style that presents its content as a menu when the user presses the control, or as a submenu when nested within a larger menu

CompactMenuControlGroupStyle

A control group style that presents its content as a compact menu when the user presses the control, or as a submenu when nested within a larger menu

RenameButton

A button that triggers a standard rename action

EditButton

A button that toggles the edit mode environment value

Min Max Current Value Gauge

Creates a gauge showing a value within a range and describes the gauge’s current, minimum, and maximum values

Current Value Gauge

Creates a gauge showing a value within a range and that describes the gauge’s purpose and current value

Gauge

Creates a gauge showing a value within a range and describes the gauge’s purpose and current value

Gauge Colors

Customizing the colors of different styles with minimal effort

CircularGaugeStyle

A gauge style that displays an open ring with a marker that appears at a point along the ring to indicate the gauge’s current value

LinearGaugeStyle

A gauge style that displays a bar with a marker that appears at a point along the bar to indicate the gauge’s current value

AccessoryLinearCapacityGaugeStyle

A gauge style that displays bar that fills from leading to trailing edges as the gauge’s current value increases

AccessoryLinearGaugeStyle

A gauge style that displays bar with a marker that appears at a point along the bar to indicate the gauge’s current value

LinearCapacityGaugeStyle

A gauge style that displays a bar that fills from leading to trailing edges as the gauge’s current value increases

AccessoryCircularCapacityGaugeStyle

A gauge style that displays a closed ring that’s partially filled in to indicate the gauge’s current value

AccessoryCircularGaugeStyle

A gauge style that displays an open ring with a marker that appears at a point along the ring to indicate the gauge’s current value

Button

Three ways to initialize a button

Button Tint

Sets the buttons tint color

Button Roles

A value that describes the purpose of a button.

Button Styles

A type that applies standard interaction behavior and a custom appearance to all buttons within a view hierarchy

PasteButton

A system button that reads items from the pasteboard and delivers it to a closure.

Button Border Shape

A shape used to draw a button’s border.

Menu Action Button

Acts like a button and opens the menu on a secondary gesture

Menu

A control for presenting a menu of actions.

Context Menu Preview

A context menu with custom preview

Context Menu

Adds a context menu to a view.

Menu Fixed Order

Order items from top to bottom

Nested Menu

A Menu inside a Menu

Menu Divider

A Menu with a Divider

Menu Section

A Section inside a Menu

GroupBox With Label

A GroupBox with Label

GroupBox

A simple GroupBox

GroupBox Background

Set a custom GroupBox background

Materials

All materials

Content Unavailable

A placeholder for empty results with optional button

ViewThatFits Vertical

A view that adapts to the available vertical space by providing the first child view that fits.

ViewThatFits

A view that adapts to the available space by providing the first child view that fits.

Color Opacity

The Color opacity modifier

Color Gradient

The Color gradient modifier

Color Variants

HierarchicalShapeStyle, a shape style that maps to one of the numbered content styles

UIKit Separator Colors

The UIKit separator colors that are also used in other components, such as the TextField

UIKit Content Background colors

The UIKit colors that are also used in other components like in List and GroupBox

UIKit Text Colors

The UIKit text colors that are also used in other components, such as the TextField

UIKit Fill Colors

UIKit Label Colors

Semantic Colors

Standard Colors

The SwiftUI standard colors

Content Unavailable Search Text

A pre-built placeholder for empty search results with search text

Content Unavailable Search

A pre-built placeholder for empty search results