Apple Colors
All system colors available on iOS, macOS and tvOS.
The squares for each color follow this structure:
Top: Light Mode | Dark Mode
Bottom: Increased Contrast Light Mode | Increased Contrast Dark Mode
Generated with Xcode 12.5, iOS 14.5, macOS 11.2.3 and tvOS 14.5
| Name | iOS | macOS | tvOS |
|---|---|---|---|
| systemBlue |
|
|
|
| systemGreen |
|
|
|
| systemIndigo |
|
|
|
| systemOrange |
|
|
|
| systemPink |
|
|
|
| systemPurple |
|
|
|
| systemRed |
|
|
|
| systemTeal |
|
|
|
| systemYellow |
|
|
|
| systemGray |
|
|
|
| systemGray2 |
|
❌ |
❌ |
| systemGray3 |
|
❌ |
❌ |
| systemGray4 |
|
❌ |
❌ |
| systemGray5 |
|
❌ |
❌ |
| systemGray6 |
|
❌ |
❌ |
| systemBackground |
|
❌ |
❌ |
| secondarySystemBackground |
|
❌ |
❌ |
| tertiarySystemBackground |
|
❌ |
❌ |
| systemGroupedBackground |
|
❌ |
❌ |
| secondarySystemGroupedBackground |
|
❌ |
❌ |
| tertiarySystemGroupedBackground |
|
❌ |
❌ |
| systemFill |
|
❌ |
❌ |
| secondarySystemFill |
|
❌ |
❌ |
| tertiarySystemFill |
|
❌ |
❌ |
| quaternarySystemFill |
|
❌ |
❌ |
| lightText |
|
❌ |
❌ |
| darkText |
|
❌ |
❌ |
| label |
|
❌ |
|
| secondaryLabel |
|
❌ |
|
| tertiaryLabel |
|
❌ |
|
| quaternaryLabel |
|
❌ |
|
| link |
|
❌ |
|
| placeholderText |
|
❌ |
|
| separator |
|
❌ |
|
| opaqueSeparator |
|
❌ |
|
| scrubberTexturedBackground |
❌ |
|
❌ |
| textBackgroundColor |
❌ |
|
❌ |
| controlTextColor |
❌ |
|
❌ |
| quaternaryLabelColor |
❌ |
|
❌ |
| findHighlightColor |
❌ |
|
❌ |
| highlightColor |
❌ |
|
❌ |
| shadowColor |
❌ |
|
❌ |
| windowFrameTextColor |
❌ |
|
❌ |
| windowBackgroundColor |
❌ |
|
❌ |
| keyboardFocusIndicatorColor |
❌ |
|
❌ |
| separatorColor |
❌ |
|
❌ |
| selectedControlColor |
❌ |
|
❌ |
| controlBackgroundColor |
❌ |
|
❌ |
| secondaryLabelColor |
❌ |
|
❌ |
| tertiaryLabelColor |
❌ |
|
❌ |
| gridColor |
❌ |
|
❌ |
| alternateSelectedControlTextColor |
❌ |
|
❌ |
| unemphasizedSelectedContentBackgroundColor |
❌ |
|
❌ |
| textColor |
❌ |
|
❌ |
| systemBrown |
❌ |
|
❌ |
| selectedContentBackgroundColor |
❌ |
|
❌ |
| selectedTextColor |
❌ |
|
❌ |
| labelColor |
❌ |
|
❌ |
| placeholderTextColor |
❌ |
|
❌ |
| unemphasizedSelectedTextBackgroundColor |
❌ |
|
❌ |
| disabledControlTextColor |
❌ |
|
❌ |
| headerTextColor |
❌ |
|
❌ |
| linkColor |
❌ |
|
❌ |
| selectedTextBackgroundColor |
❌ |
|
❌ |
| unemphasizedSelectedTextColor |
❌ |
|
❌ |
| controlColor |
❌ |
|
❌ |
| selectedControlTextColor |
❌ |
|
❌ |
| underPageBackgroundColor |
❌ |
|
❌ |
| selectedMenuItemTextColor |
❌ |
|
❌ |