/app-icon-generator

name: app-icon-generator
description: Generates an app icon for macOS or iOS — a fast CoreGraphics placeholder and/or flat layered source art to finish in Icon Composer (the Liquid Glass / iOS 26+ standard). Produces appearance variants (light/dark/tinted) and installs into the asset catalog. Use when the user wants to create, generate, iterate, or update an app icon.
allowed-tools: [Read, Write, Edit, Glob, Grep, Bash, AskUserQuestion]
last_verified: 2026-07-16
review_by: 2027-06-22
os_version: iOS 27 / macOS 27

App Icon Generator

Generate an app icon programmatically with a CoreGraphics Swift script, resize it to every required size, and install it into the Xcode asset catalog — with appearance variants (light/dark/tinted).

Read first — the Liquid Glass era (iOS 26 / macOS 26)

> **Apple icon standards verified as of July 2026** — Icon Composer, Xcode 26, macOS Tahoe 26.4+. This guidance is static (the skill does no per-run web lookup); if that date is well in the past or the OS has moved on, re-verify against the [HIG · App icons](https://developer.apple.com/design/human-interface-guidelines/app-icons) before trusting the specifics below.

Apple's shippable icon format changed. On iOS 26 / macOS 26 the modern app icon is a **layered, light-responsive Liquid Glass icon** authored in **Icon Composer** (free; ships with Xcode 26, needs macOS Tahoe 26.4+). You supply *flat* artwork in up to **four depth groups** (background → foreground); the **system renders the glass** — specular highlights, refraction, translucency, shadows — and masks the rounded-rect shape. One `.icon` file adapts across iPhone, iPad, Mac, and Apple Watch and across **Default / Dark / Mono (tinted)** appearances.

**So this skill does NOT produce the final iOS 26 icon.** Icon Composer is GUI-first; no script can author a true layered `.icon`. Its two honest roles are:

1. **Placeholder** — a fast flat 1024 PNG so early builds, TestFlight, and screenshots feel real before you invest in the real icon. 2. **Layered source art** — flat background / midground / foreground PNGs (or SVGs), effect-free, ready to drag into Icon Composer, where you assemble depth and export the `.icon`.

**What changed vs. the classic flow:**

• **Do not bake in lighting.** No pre-painted specular highlights, drop shadows, or gradients-used-as-lighting — the system owns those now, and baking them in double-exposes against the system glass. (The `drawShine`/`drawShadow` blocks below are **legacy-only**, off by default for iOS 26+ targets.)
• **Do not round the corners.** Icon Composer / the system apply the shape mask — fill a full square canvas.
• **SVG for shapes, PNG for effects** — vector where you can, raster only where you must.
• **Provide appearance variants** — light (default), dark, and tinted/mono. A single flat PNG only fills the light slot and won't adapt on iOS 18+.

**Detect the target first:** read the deployment target (`IPHONEOS_DEPLOYMENT_TARGET` / `MACOSX_DEPLOYMENT_TARGET` in the pbxproj, or `.planning/APP.md`). iOS 26+ / macOS 26+ → lead with the Icon Composer handoff and treat the flat PNG as a placeholder. Older targets → the classic flat + appearances path is fine to ship. **If the deployment target is newer than the "verified as of" date above, flag it to the user and re-verify the icon rules against the current HIG before generating** — the skill won't know about anything Apple shipped after that date.

When This Skill Activates

Use this skill when the user:

• Asks to "generate an app icon" or "create an icon"
• Wants a "placeholder icon" or "app icon design"
• Mentions "icon for my app" or "need an app icon"
• Asks to "update the app icon"

Pre-Generation Checks

1. Project Context Detection

Glob: **/Assets.xcassets/AppIcon.appiconset/Contents.json

• Identify platform: macOS, iOS, or universal
• Check for existing icon files (warn before overwriting)
• Read `Contents.json` to understand required sizes

2. App Context Detection

Gather app information to customize the icon:

Read: .planning/APP.md          (if exists — app definition)
Read: .planning/CODEBASE.md     (if exists — app description)
Grep: "CFBundleName" or app name in project files

If no planning files exist, ask the user.

Configuration Questions

Ask via AskUserQuestion:

Question 1: App Category

"What category best describes your app?"

• **Productivity** — Clean geometric shapes, blues/teals
• **Creative/Media** — Vibrant colors, camera/brush/music motifs
• **Developer Tools** — Dark backgrounds, terminal/code symbols
• **Utilities** — Functional shapes, neutral/system colors

Question 2: Visual Style

"What visual style do you prefer?"

• **Bold Symbol** — Single prominent shape/icon centered (like the record button)
• **Contained Scene** — A scene inside a shape (like a monitor with elements)
• **Abstract Mark** — Geometric/abstract design (like viewfinder brackets)
• **Gradient Glyph** — SF Symbol-style glyph on gradient background

Question 3: Color Palette

"What color palette fits your app?"

• **Deep Blue/Indigo** — Professional, trustworthy (navy #0f0c29 to indigo #302b63)
• **Teal/Cyan** — Fresh, modern (dark teal #0a1628 to blue #1a4a6b)
• **Purple/Violet** — Creative, premium (midnight #1a0533 to violet #4a1a8a)
• **Warm/Orange** — Energetic, friendly (dark red #2d1117 to orange #c0392b)

Question 4: Accent Color

"What accent color for the focal element?"

• **Red** — Attention, recording, alerts (#ff453a to #d63031)
• **Blue** — Trust, communication (#007aff to #0056b3)
• **Green** — Success, nature, health (#34c759 to #248a3d)
• **Gold/Yellow** — Premium, energy (#ffd60a to #c7a600)

Apple HIG Icon Guidelines

**Read `apple-hig-icons.md` before generating.**

**Timeless rules (all eras):**

1. **No text** in the icon — must be universally recognizable 2. **Single focal point** — one clear element the eye is drawn to 3. **Simple shapes** — legible at 16×16 (macOS menu bar) an