app-icon-generator
installsforks
How to install app-icon-generator?
rshankras/claude-code-apple-skills/app-icon-generator
$npx -y skills add rshankras/claude-code-apple-skills --skill app-icon-generatorGenerates 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
SKILL.md
| 1 | # App Icon Generator |
| 2 | |
| 3 | 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). |
| 4 | |
| 5 | ## Read first — the Liquid Glass era (iOS 26 / macOS 26) |
| 6 | |
| 7 | > **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. |
| 8 | |
| 9 | 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. |
| 10 | |
| 11 | **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: |
| 12 | |
| 13 | 1. **Placeholder** — a fast flat 1024 PNG so early builds, TestFlight, and screenshots feel real before you invest in the real icon. |
| 14 | 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`. |
| 15 | |
| 16 | **What changed vs. the classic flow:** |
| 17 | - **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.) |
| 18 | - **Do not round the corners.** Icon Composer / the system apply the shape mask — fill a full square canvas. |
| 19 | - **SVG for shapes, PNG for effects** — vector where you can, raster only where you must. |
| 20 | - **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+. |
| 21 | |
| 22 | **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. |
| 23 | |
| 24 | ## When This Skill Activates |
| 25 | |
| 26 | Use this skill when the user: |
| 27 | - Asks to "generate an app icon" or "create an icon" |
| 28 | - Wants a "placeholder icon" or "app icon design" |
| 29 | - Mentions "icon for my app" or "need an app icon" |
| 30 | - Asks to "update the app icon" |
| 31 | |
| 32 | ## Pre-Generation Checks |
| 33 | |
| 34 | ### 1. Project Context Detection |
| 35 | |
| 36 | ``` |
| 37 | Glob: **/Assets.xcassets/AppIcon.appiconset/Contents.json |
| 38 | ``` |
| 39 | |
| 40 | - Identify platform: macOS, iOS, or universal |
| 41 | - Check for existing icon files (warn before overwriting) |
| 42 | - Read `Contents.json` to understand required sizes |
| 43 | |
| 44 | ### 2. App Context Detection |
| 45 | |
| 46 | Gather app information to customize the icon: |
| 47 | |
| 48 | ``` |
| 49 | Read: .planning/APP.md (if exists — app definition) |
| 50 | Read: .planning/CODEBASE.md (if exists — app description) |
| 51 | Grep: "CFBundleName" or app name in project files |
| 52 | ``` |
| 53 | |
| 54 | If no planning files exist, ask the user. |
| 55 | |
| 56 | ## Configuration Questions |
| 57 | |
| 58 | Ask via AskUserQuestion: |
| 59 | |
| 60 | ### Question 1: App Category |
| 61 | "What category best describes your app?" |
| 62 | - **Productivity** — Clean geometric shapes, blues/teals |
| 63 | - **Creative/Media** — Vibrant colors, camera/brush/music motifs |
| 64 | - **Developer Tools** — Dark backgrounds, terminal/code symbols |
| 65 | - **Utilities** — Functional shapes, neutral/system colors |
| 66 | |
| 67 | ### Question 2: Visual Style |
| 68 | "What visual style do you prefer?" |
| 69 | - **Bold Symbol** — Single prominent shape/icon centered (like the record button) |
| 70 | - **Contained Scene** — A scene inside a shape (like a monitor with elements) |
| 71 | - **Abstract Mark** — Geometric/abstract design (like viewfinder brackets) |
| 72 | - **Gradient Glyph** — SF Symbol-style glyph on |
People who liked this also viewed
6 picksType
- ai-video-generationinference.sh Agent skills for using our API to give your agents access to hundreds of apps and other agentsSkillsJul 2026
- imagegen-frontend-webElite frontend image-direction skill for generating premium, conversion-aware website design references. CRITICAL OUTPUT RULE — generate ONE separate horizontal image FOR EVERY section. A landing pageSkillsJul 2026
- hyperframes-mediaWrite HTML. Render video. Built for agents.SkillsJul 2026
- media-useAgent Media OS, the single skill for every media need in a HyperFrames project. Resolve BGM, SFX, image, icon, brand logo, voice, color grade, or LUT into a frozen local file or paste-ready block + leSkillsJul 2026
- general-videoAuthor or edit a custom HyperFrames composition when no specialized workflow fits, or when BRIEF.md sets flow: companion. Use for longer or multi-scene pieces, brand and sizzle reels, montages, staticSkillsJul 2026
- product-launch-videoTurn a product or marketing URL, pasted script, or brief into a product launch / promo video — SaaS promos, feature reveals, product demos, app and company launches. Use when the user wants to market,SkillsJul 2026
