Color

Color is a great way to impart vitality, provide visual continuity, communicate status information, give feedback in response to user actions, and help people visualize data. A watchOS app uses one global tint color and may use additional colors.

Values Name SwiftUI API
R 32 G 148 B 250
Blue systemBlue
R 172 G 142 B 104
Brown systemBrown
R 90 G 200 B 250
Cyan systemCyan
R 155 G 160 B 170
Gray systemGray
R 4 G 222 B 113
Green systemGreen
R 120 G 122 B 255
Indigo systemIndigo
R 102 G 212 B 207
Mint systemMint
R 255 G 149 B 0
Orange systemOrange
R 250 G 17 B 79
Pink systemPink
R 191 G 90 B 242
Purple systemPurple
R 255 G 59 B 48
Red systemRed
R 106 G 196 B 220
Teal systemTeal
R 255 G 230 B 32
Yellow systemYellow

Use pure black for your app’s background color. Pure black — that is, #000000 — blends seamlessly with the Apple Watch bezel and creates the illusion of an edgeless screen.

Screenshot of the beginning view for an outdoor run, which shows a green circle on a black background and the word Ready within the circle.

Avoid using color as the only way to show interactivity. watchOS uses a rounded rectangle shape as the primary way to indicate interactivity for buttons and lists.

Screenshot of a button on a black background. The button has a rounded rectangle shape and the title Tappable.

Consider using your primary brand color as a global accent color. A global accent color gives your app a polished appearance and gives each screen consistency and familiarity. As you consider using additional colors, check that your color choices work well in different cultures and can be perceived by everyone. For guidance, see Color and Contrast.

Recognize that people might prefer graphic complications to use tinted mode instead of full color. In watchOS 6 and later, the system can use a single color that’s based on the wearer’s selected color to tint a graphic complication’s images, gauges, and text. For guidance, see Complications.