macOS, watchOS, visionOS & tvOS App Icons
Last updated
An iPhone icon is a 1024×1024 square that iOS rounds for you. The rest of Apple's platforms each add a twist: the Mac needs many sizes and now enforces a single shape, Apple Watch and Vision Pro crop to a circle, and Apple TV icons are landscape and move. This guide covers what each one expects.
The common rule: supply square, unmasked layers
Apple's Human Interface Guidelines are consistent on one point across every platform: give the system unmasked artwork and let it apply the final shape. For iOS, iPadOS and macOS you provide square layers and the system adds rounded corners that match the device. For watchOS and visionOS you also provide square layers, and the system crops them to a circle. For tvOS you provide rectangular layers and the system rounds the corners. Pre-masking your own artwork makes edges look jagged and interferes with the highlights the system draws.
| Platform | Layout size | Final shape | Style | How you build it |
|---|---|---|---|---|
| iOS, iPadOS, macOS | 1024×1024 px | Rounded rectangle | Layered (Liquid Glass) | Icon Composer, or asset catalog |
| watchOS | 1088×1088 px | Circle | Layered | Icon Composer, or asset catalog |
| visionOS | 1024×1024 px | Circle | Layered 3D, up to 3 layers | Image stack in asset catalog |
| tvOS | 800×480 px | Landscape rounded rectangle | Layered parallax, 2–5 layers | Image stack in asset catalog |
macOS
From free-form shapes to one system shape
Mac icons used to come in any shape. A document, a compass or a robot could sit directly on the desktop with its own silhouette and shadow. macOS Big Sur moved Mac icons toward a rounded-square shape that matched iOS, and Apple's templates since then have drawn the icon body on a grid inside the 1024×1024 canvas, leaving room around it for a shadow.
macOS 26 made that shape mandatory in practice. The system now applies the rounded-rectangle mask itself, as iOS does. An app whose icon does not fit that shape is shown shrunk down inside a grey rounded square, which makes it look out of place in the Dock. If you maintain a Mac app with an older free-form icon, redesigning it as a full-bleed square layer set is the way to avoid that container.
Sizes when you use an asset catalog
With Icon Composer, a single layered file covers the Mac along with iPhone, iPad and Apple Watch. If you still use an asset catalog, Xcode's documentation notes that macOS needs an image for every size rather than one 1024 image. The Mac icon set uses five point sizes, each at 1x and 2x:
| Point size | @1x pixels | @2x pixels | Where it appears (examples) |
|---|---|---|---|
| 16pt | 16×16 | 32×32 | Finder list view, menus |
| 32pt | 32×32 | 64×64 | Finder lists, Spotlight |
| 128pt | 128×128 | 256×256 | Finder icon view |
| 256pt | 256×256 | 512×512 | Large Finder icons, Get Info |
| 512pt | 512×512 | 1024×1024 | Largest Finder size, App Store |
Because the small sizes are separate files, you can redraw them. At 16×16 and 32×32 pixels, simplifying the artwork, thickening strokes or removing secondary detail often reads better than a straight downscale.
watchOS
Apple Watch icons are displayed as circles. You still design a square canvas, now 1088×1088 pixels in Icon Composer, and the system applies the circular mask. Since Xcode 14, a watchOS icon can be generated from a single large image, which replaced the long list of device-specific sizes older projects carried.
- Centre the subject. The circle cuts away more of the corners than a rounded square does, so anything near the edge of the canvas is at risk. Apple's production templates include a grid to help.
- Avoid a black background. The watch face is black, so Apple recommends lightening a black background so the icon doesn't disappear into the display.
- Keep it consistent with the iPhone app. The watch icon should be recognisably the same app, just adapted to the circle.
- No appearances. Icon Composer shows no dark or tinted variants for watchOS, so one design covers every watch face.
visionOS
On Apple Vision Pro, icons are circular, three-dimensional objects. A visionOS icon is built from a background layer plus one or two layers on top, three layers at most, each a 1024×1024 square. The system adds shadows between the layers and uses the transparency of the upper layers to create an embossed look. The icon also subtly expands when someone looks at it.
- Background layer: opaque and full-bleed. A solid colour or gradient usually works best.
- Upper layers: use transparency so the depth effect has something to work with, and keep the main subject well inside the circle.
- Avoid fake holes. Apple warns against shapes in the background that are meant to look concave. The system's shadows and highlights tend to make them stand out instead of recede.
You assemble the layers as an image stack in the asset catalog, and you can preview the result with Apple's Parallax Previewer. The App Store builds its listing icon from the same stack.
tvOS
Apple TV icons are landscape and move. When an icon is focused it rises toward the viewer and sways with movement on the remote, producing a parallax effect from its separate layers. A tvOS icon uses between two and five layers, assembled as an image stack. The Home Screen icon has a layout size of 800×480 pixels, which is the @2x version of a 400×240 point icon, and the App Store uses a larger layered icon commonly specified at 1280×768 pixels.
Because the icon scales and shifts, the system can crop content near the edges, cropping foreground layers more than background layers. Keep a generous safe zone, and if your icon includes text, place it on a top layer so the parallax doesn't clip it. tvOS apps also need Top Shelf artwork, which is separate from the icon.
Keeping one identity across platforms
Apple asks for a visually consistent icon on every platform an app supports, so people don't mistake one app for several. The practical approach is to design the core mark once, as clean vector layers, then adapt the container: square for iPhone and Mac, circle-safe for Watch and Vision Pro, and wide with extra margin for TV.
Start with the iPhone icon. The iOS app icon sizes guide covers the base sizes, the dark and tinted icons guide covers the appearances iOS and macOS share, and the app icon generator produces the iOS and Android files from one image. For a compact checklist of both mobile platforms, see the app icon guidelines.
More guides
- iOS App Icon Sizes – Every iPhone, iPad and App Store icon size, what each one is used for, and how Xcode’s single-size asset works.
- Android Adaptive Icons – Foreground and background layers, the 108dp canvas, the 66dp safe zone and Android 13 themed icons.
- PWA Manifest Icons – Which icons a web app manifest needs, how maskable icons work and how browsers choose between them.
- iOS Dark & Tinted Icons – How dark and tinted Home Screen icons work, what to supply for each appearance and common mistakes.
- App Icon Rejections – The icon problems that get builds rejected on the App Store and Google Play, and how to avoid them.