UI Element Colors

The standard color objects you can use for labels, text, backgrounds, links, and more.

Overview

UIKit provides standard color objects for the foreground and background colors of your app's UI elements. The names of these color objects reflect their intended use, rather than specific color values.

Except where noted, standard color objects adapt automatically to Dark Mode changes when you use the provided UIColor object. If you retrieve the color values, either directly or using another type such as CGColor, you must handle Dark Mode changes yourself. For more information about supporting Dark Mode, see Supporting Dark Mode in Your Interface.

Topics

Label Colors

class var label: UIColor

The color for text labels that contain primary content.

class var secondaryLabel: UIColor

The color for text labels that contain secondary content.

class var tertiaryLabel: UIColor

The color for text labels that contain tertiary content.

class var quaternaryLabel: UIColor

The color for text labels that contain quaternary content.

FIll Colors

class var systemFill: UIColor

An overlay fill color for thin and small shapes.

class var secondarySystemFill: UIColor

An overlay fill color for medium-size shapes.

class var tertiarySystemFill: UIColor

An overlay fill color for large shapes.

class var quaternarySystemFill: UIColor

An overlay fill color for large areas that contain complex content.

Text Colors

class var placeholderText: UIColor

The color for placeholder text in controls or text views.

Standard Content Background Colors

Use these colors for standard table views and designs that have a white primary background in a light environment.

class var systemBackground: UIColor

The color for the main background of your interface.

class var secondarySystemBackground: UIColor

The color for content layered on top of the main background.

class var tertiarySystemBackground: UIColor

The color for content layered on top of secondary backgrounds.

Grouped Content Background Colors

Use these colors for grouped content, including table views and platter-based designs.

class var systemGroupedBackground: UIColor

The color for the main background of your grouped interface.

class var secondarySystemGroupedBackground: UIColor

The color for content layered on top of the main background of your grouped interface.

class var tertiarySystemGroupedBackground: UIColor

The color for content layered on top of secondary backgrounds of your grouped interface.

Separator Colors

class var separator: UIColor

The color for thin borders or divider lines that allows some underlying content to be visible.

class var opaqueSeparator: UIColor

The color for borders or divider lines that hides any underlying content.

Link Color

class var link: UIColor

The color for links.

Nonadaptable Colors

class var darkText: UIColor

The nonadaptable system color for text on a light background.

class var lightText: UIColor

The nonadaptable system color for text on a dark background.

Deprecated Colors

class var groupTableViewBackground: UIColor

The system color to use for the background of a grouped table.

Deprecated

See Also

Getting Existing Colors

Standard Colors

The standard color objects for specific shades, such as red, blue, green, black, white, and more.