Interactive previews iPhone
UIKit Content Background colors
The UIKit colors that are also used in other components like in List and GroupBox
Platform Compatibility
iOS 13.0.+ iPadOS 13.0+ visionOS 1.0+
Tags
SwiftUI Code
VStack {
List {
Section {
Text("content")
}
}
.frame(maxHeight: 50)
HStack {
smallRect
// can also be used as inverted text color
.foregroundStyle(Color(.systemBackground))
smallRect
// GroupBox content backgroud
.foregroundStyle(Color(.secondarySystemBackground))
smallRect
.foregroundStyle(Color(.tertiarySystemBackground))
smallRect
// can also be used as inverted text color
// List background
.foregroundStyle(Color(.systemGroupedBackground))
smallRect
// List content background
.foregroundStyle(Color(.secondarySystemGroupedBackground))
smallRect
.foregroundStyle(Color(.tertiarySystemGroupedBackground))
}
GroupBox {
Text("content")
}
.frame(maxHeight: 50)
}Found an issue or have a suggestion?
Created: May 29, 2025Updated: May 29, 2025
More Color Components
View allUIKit Separator Colors
The UIKit separator colors that are also used in other components, such as the TextField
UIKit Text Colors
The UIKit text colors that are also used in other components, such as the TextField
Color Variants
HierarchicalShapeStyle, a shape style that maps to one of the numbered content styles
Explore Other Components
Browse allAccessoryLinearCapacityGaugeStyle
A gauge style that displays bar that fills from leading to trailing edges as the gauge’s current value increases
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