Color

The proper use of color provides visual continuity, supports your branding, and aids in communication. Every app has a global tint color that you can configure to reflect your primary brand color. You can add colors for branding and to convey information, but be sure to use light colors for text to ensure legibility and contrast.

R 250 G 17 B 79
17% Opacity
R 255 G 59 B 48
17% Opacity
R 255 G 149 B 0
15% Opacity
R 255 G 230 B 32
14% Opacity
R 4 G 222 B 113
14% Opacity
R 0 G 245 B 234
15% Opacity
R 90 G 200 B 250
15% Opacity
R 32 G 148 B 250
17% Opacity
R 120 G 122 B 255
20% Opacity
R 242 G 244 B 255
14% Opacity

Use black for your app’s background color. Black blends seamlessly with the Apple Watch bezel and creates the illusion of an edgeless screen.

Be aware of color blindness and of how different cultures perceive color. Everyone sees color differently. Make sure the colors you choose are effective and send the appropriate message.

Avoid using color as the only way to show interactivity. The rounded rectangle shape of buttons and lists is the primary means of indicating interactivity.

Use sufficient color contrast ratios. Insufficient contrast in your app makes content hard to read for everyone. Icons and text might blend with the background, for example. An online color contrast calculator can help you accurately analyze the color contrast in your app, to ensure that it meets optimal standards. Strive for a minimum contrast ratio of 4.5:1, although 7:1 is preferred because it meets more stringent accessibility standards.