Designing Icons for Apple Watch: Size and Style Guide

1. The Small Screen Challenge

Apple Watch icons are the smallest icons in the Apple ecosystem. On a 40mm watch, the home screen icon is tiny. This means your design needs to be radically simple. What works on an iPhone home screen might be a blurry mess on a Watch.

2. Circular Masking

Unlike iOS icons which are rounded rectangles, watchOS icons are circular. This circular mask is applied automatically by the system.

Design Tip

Design on a square canvas, but keep your important content in the center. Avoid placing crucial details in the corners, as they will be cropped out by the circular mask.

3. Size Requirements

You need to provide several sizes to support different Apple Watch models (Series 1 through Series 9/Ultra).

Device Size	Icon Size (pixels)	Notes
44mm / 45mm / 49mm	100x100	Series 4, 5, 6, SE, 7, 8, 9, Ultra
40mm / 41mm	88x88	Series 4, 5, 6, SE, 7, 8, 9
42mm	86x86	Series 1, 2, 3
38mm	80x80	Series 1, 2, 3

4. Simplification Strategies

Remove Backgrounds: A solid black background blends with the Watch's bezel, making the icon look like it's floating. This is a popular and effective look on watchOS.

Focus on One Element: If your iPhone icon has a symbol and a background pattern, strip the pattern for the Watch version. Just keep the symbol.

5. Contrast and Visibility

The Apple Watch is often viewed outdoors in bright sunlight. High contrast is essential. Use bright, saturated colors against a dark background (or black). Subtle gradients or low-contrast details will vanish in direct sunlight.

6. Testing

The simulator is okay, but nothing beats testing on real hardware. Deploy your app to a Watch and walk outside. Can you recognize the icon at a glance while walking? If yes, you've done a good job.