๐ŸŒ— iOS 18

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.

โฑ 4 min read๐ŸŽ iOS 18โœ… Apple guidelines

The three modes, side by side

VariantBackgroundGlyph treatment
Light (default)Your own opaque artworkFull color, as designed
DarkTransparent โ€” Apple supplies the gradientFull color or forced white
TintedTransparentGrayscale 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.