iOS App Icons look simple until release week: wrong pixel dimensions, an accidental alpha channel on the 1024 px marketing asset, or a hand-rounded PNG that fights Xcode’s automatic mask. This article is a decision matrix for designers and front-end–adjacent asset owners who must ship a complete AppIcon.appiconset folder: a size comparison table (role → points → pixels), Contents.json rules, sRGB export acceptance, transparency policy, superellipse / corner-radius handoff rules, naming, and batch validation you can run on an M-series Mac—including a dedicated remote Mac for overnight renders and CI-style checks.
① Size & role matrix (PNG pixel targets)
Ship square PNGs at exact pixel dimensions listed below. Xcode maps each file via Contents.json; do not rely on “Retina scaling” inside the asset catalog to fix a wrong master. Keep one vector or high-resolution master (e.g. 1024 px design grid), then derive sizes—on Apple Silicon, batch resizes complete quickly thanks to high memory bandwidth and efficient CPU/GPU paths in native exporters.
| Platform / role | Points (pt) | Scale | PNG (px) | Typical filename token |
|---|---|---|---|---|
| iPhone Notification | 20 | 2× / 3× | 40 × 40 / 60 × 60 | [email protected], @3x |
| iPhone Settings | 29 | 2× / 3× | 58 × 58 / 87 × 87 | [email protected], @3x |
| iPhone Spotlight | 40 | 2× / 3× | 80 × 80 / 120 × 120 | [email protected], @3x |
| iPhone App | 60 | 2× / 3× | 120 × 120 / 180 × 180 | [email protected], @3x |
| iPad Notification | 20 | 1× / 2× | 20 × 20 / 40 × 40 | [email protected], @2x |
| iPad Settings | 29 | 1× / 2× | 29 × 29 / 58 × 58 | [email protected], @2x |
| iPad Spotlight | 40 | 1× / 2× | 40 × 40 / 80 × 80 | [email protected], @2x |
| iPad App | 76 | 1× / 2× | 76 × 76 / 152 × 152 | [email protected], @2x |
| iPad Pro App | 83.5 | 2× | 167 × 167 | [email protected] |
| App Store / marketing | 1024 | 1× | 1024 × 1024 | [email protected] or [email protected] (match generator) |
Align color conversion with your wider PNG policy in Mac PNG color management: sRGB vs Display P3 so icon batches do not drift from marketing stills.
② Contents.json contract
AppIcon.appiconset/Contents.json is the handoff contract between design and Xcode. Each entry in the images array should declare idiom (iphone, ipad, ios-marketing), size (point size string such as "60x60"), scale ("1x", "2x", "3x"), and filename. The marketing 1024 slot uses idiom: "ios-marketing" with size: "1024x1024" and scale: "1x".
- Single source of truth: After designers drop PNGs, run
plutil -lint Contents.jsonon the remote Mac to catch trailing commas and typos before CI. - No orphan files: Every PNG in the folder should be referenced; every
filenameentry should exist on disk. - Version pin: Commit the JSON alongside PNGs so “which catalog layout?” is always diffable.
③ Superellipse mask, alpha & “flat” delivery
iOS applies the rounded-rectangle (superellipse) mask at render time. Deliver fully square PNGs with artwork extended to the edges unless your team explicitly uses a different internal template; do not bake iOS corner radius into the bitmap for production App Icons. Keep logos and faces inside a central safe region so the mask does not clip critical detail.
Alpha channel: The App Store 1024×1024 marketing icon must not use transparency—Apple rejects alpha on that slot. For smaller slots, prefer fully opaque icons unless you have a documented exception; accidental semi-transparent pixels often come from anti-aliased “rounded” exports or checkerboard backgrounds. Treat “unexpected alpha” as a release blocker and fold it into the checklist below. For broader PNG alpha governance, see OpenClaw PNG QA: batch transparency checks on remote Mac.
④ Executable export parameters (sRGB)
Standardize these parameters across Figma, Sketch, Affinity, and Photoshop so every derivative is comparable:
| Parameter | Recommended value | Notes |
|---|---|---|
| Color space | sRGB (export converted, not “untagged guess”) | Match embedded ICC policy to web icons; mirror the same presets you use for UI PNG slices in Figma, Sketch, or Affinity. |
| Bit depth | 8-bit RGB(A) | 16-bit intermediates OK before final downscale; deliver 8-bit PNG. |
| Resize kernel | Bicubic / Lanczos (tool-native “high quality”) | Re-sharpen subtle line work after downscale if needed. |
| 1024 master | No alpha; opaque background per brand | Validate with scripts in section ⑥. |
⑤ Acceptance checklist (design + front-end)
| Check | Method | Pass criteria |
|---|---|---|
| Dimensions | Automated (sips -g pixelWidth -g pixelHeight or ImageMagick identify) |
Each PNG matches matrix exactly (±0 px). |
| Square canvas | Visual + script | Width equals height for every file. |
| Alpha (marketing) | identify -format '%[channels]' or PNG chunk inspection |
1024×1024 has no alpha; RGB only. |
| Alpha (other slots) | Histogram / spot pixels | No accidental transparency unless spec allows; no checkerboard fringe. |
| Mask policy | Design review | Square delivery; no pre-rounded production bitmaps; critical glyph inside safe area. |
Contents.json |
plutil -lint + filename crosswalk |
Valid JSON; every filename exists; no unreferenced PNGs. |
| sRGB intent | Spot open in Preview + documented export preset | Embedded or explicitly converted per team ICC policy. |
| Naming | Regex in CI | Stable pattern: Icon-App-<WxH>@<scale>.png aligned with JSON. |
⑥ Batch validation on M-series & remote Mac
On Apple Silicon, looping over ~15–20 small PNGs is trivial; the win is repeatability and running checks while your laptop is offline. A remote Mac can host the same scripts under a fixed macOS + tool versions, mirroring how studios pin batch PNG QA.
Step A — dimension sweep (folder):
for f in *.png; do
echo -n "$f "
sips -g pixelWidth -g pixelHeight "$f" 2>/dev/null | paste -sd ' ' -
done
Step B — flag alpha on the marketing icon: use ImageMagick identify -verbose on [email protected] (or your 1024 file) and assert the alpha channel is absent; fail the build if rgba appears.
Step C — manifest: emit icons_manifest.csv with path,w,h,bytes,has_alpha,colorIntent and attach it to the release ticket. For high-throughput export jobs that surround icon work, batch 4K PNG export on remote Mac M4 describes queue discipline that scales to large asset drops.
Parallelism tip: when generating from a single 1024 master, run independent resize jobs in parallel (xargs -P)—M-series machines handle multiple concurrent sips or CLI resizers well within thermal norms for short bursts.
Summary
Use the pixel matrix as the single sizing contract, keep Contents.json linted and aligned with filenames, enforce sRGB export parameters across tools, and treat alpha on the 1024 marketing icon as a hard failure. Pair design review (mask/safe zone) with scripted batch checks on an M-series Mac—ideally a dedicated remote Mac—so icon drops stay boring and shippable.
Next steps: remote Mac for design delivery
Browse plans on the MacPng homepage, then open rental options and pricing to add a remote Mac node for icon batches, PNG QA, and long-running validation without blocking your primary workstation. The help center covers SSH/VNC onboarding for distributed teams.
Ship iOS icons & PNG sets from a remote Mac
Pin macOS and CLI tool versions, run overnight batch exports and validation, and hand off AppIcon.appiconset bundles with manifests—ideal for studios shipping frequent TestFlight builds.