iOS app icon design: light, dark & tinted
Since iOS 18, "your app icon" actually means three separate assets that behave completely differently. Here's exactly what each one requires.
The three modes, side by side
| Variant | Background | Glyph treatment |
|---|---|---|
| Light (default) | Your own opaque artwork | Full color, as designed |
| Dark | Transparent โ Apple supplies the gradient | Full color or forced white |
| Tinted | Transparent | Grayscale luminance, tinted by the OS |
Why this trips people up
๐ Dark icon transparency
A common mistake is designing a dark icon as a solid dark square. Apple wants only the glyph, on a transparent background โ it renders the surrounding gradient itself.
โช Tinted isn't a color choice
You don't pick the tint color โ the user does, in Settings. Your job is only to provide a clean grayscale silhouette that reads well under any tint.
๐ฏ Consistency matters
All three variants should be instantly recognizable as the same app. A glyph that changes meaning between modes will confuse users switching themes.
Frequently asked
Why is the dark icon transparent?
Apple composites your glyph onto its own system dark gradient โ supplying your own dark background creates a visible mismatch.
How is the tinted icon generated?
From a grayscale version of your glyph based on luminance, which the OS then tints with the user's accent color.
What's the base spec for the light icon?
See our App Store icon size guide for the full 1024ร1024 requirements.