Now liveThe Skillselion MCP - thousands of ranked skills, loaded into your agent mid-task. No install.Get it →
rshankras avatar

App Icon Generator

  • 4 installs
  • 591 repo stars
  • Updated July 24, 2026
  • rshankras/claude-code-apple-skills

Generates app icons programmatically with a CoreGraphics Swift script following Apple HIG, producing all required sizes and installing them into the Xcode asset catalog.

About

Generates production-quality iOS/macOS app icons via a CoreGraphics script and installs them into the AppIcon asset catalog. A developer uses it to create a placeholder or HIG-compliant icon across all required sizes.

  • Reads Contents.json to produce all required icon sizes
  • Pulls app context from .planning files to customize the icon

App Icon Generator by the numbers

  • 4 all-time installs (skills.sh)
  • +2 installs in the week ending Aug 5, 2026 (Skillselion tracking)
  • Ranked #874 of 1,039 Mobile Development skills by installs in the Skillselion catalog
  • Data as of Aug 5, 2026 (Skillselion catalog sync)
npx skills add https://github.com/rshankras/claude-code-apple-skills --skill app-icon-generator

Add your badge

Show developers this skill is listed on Skillselion. Paste this into your README.

Listed on Skillselion
Installs4
repo stars591
Last updatedJuly 24, 2026
Repositoryrshankras/claude-code-apple-skills

What it does

Generates app icons programmatically with a CoreGraphics Swift script following Apple HIG, producing all required sizes and installing them into the Xcode asset catalog.

Files

SKILL.mdMarkdownGitHub ↗

App Icon Generator

Generate production-quality app icons programmatically using a CoreGraphics Swift script. Produces all required sizes and installs into the Xcode asset catalog.

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. Key rules:

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 — must be legible at 16x16 (macOS menu bar) 4. Fill the canvas — macOS/iOS apply the rounded rect mask automatically 5. Front-facing perspective — no 3D tilts or dramatic angles 6. Use gradients sparingly — subtle depth, not rainbow 7. Ensure contrast — the focal element must stand out from background 8. Platform-appropriate:

  • macOS: Can be more detailed (icons display larger)
  • iOS: Keep simpler (smaller grid, more rounded)

Generation Process

Step 1: Determine Icon Design

Based on the user's answers (or app context), select:

  • Background: Gradient direction, colors, optional radial glow
  • Primary Element: The main shape/symbol
  • Secondary Elements: Optional ring, glow, accent shapes
  • Style Modifiers: Shine, shadow, stroke weight

Step 2: Generate Swift Script

Create a self-contained Swift script at scripts/generate-icon.swift that:

  • Uses import AppKit and CoreGraphics (no dependencies)
  • Generates 3 variants at 1024x1024
  • Saves to icon-variants/ directory
  • Uses the design parameters from Step 1

Script structure:

#!/usr/bin/env swift
import AppKit
import CoreGraphics

let size: CGFloat = 1024
// ... helper functions (gradients, glows, shapes)
// ... variant generation functions
// ... save and output

Design building blocks (combine these based on category/style):

Building BlockFunctionUse For
drawGradientBackgroundLinear gradient fillAll icons
drawRadialGlowSoft colored glow behind focal elementAdding depth
drawCircleFilled/stroked circleRecord buttons, dots, orbs
drawRoundedRectRounded rectangleScreens, cards, containers
drawRingCircle outlineBorders, focus rings
drawBracketsCorner bracket marksViewfinders, capture
drawMonitorScreen + stand shapeScreen/display apps
drawShieldShield outlineSecurity/privacy apps
drawGearGear/cog shapeSettings/utility apps
drawWaveformAudio waveform barsAudio/music apps
drawDocumentPage with fold cornerDocument/writing apps
drawShineElliptical specular highlightAdding polish
drawShadowDrop shadow beneath elementAdding depth

Step 3: Run Script and Present Variants

swift scripts/generate-icon.swift

Show all 3 variants to the user using the Read tool (Claude can view images). Ask the user to pick one, or request adjustments.

Step 4: Resize and Install

Once the user picks a variant:

1. Resize using sips (built into macOS):

For macOS (10 sizes):

sips -z 16 16     master.png --out icon_16x16.png
sips -z 32 32     master.png --out icon_16x16@2x.png
sips -z 32 32     master.png --out icon_32x32.png
sips -z 64 64     master.png --out icon_32x32@2x.png
sips -z 128 128   master.png --out icon_128x128.png
sips -z 256 256   master.png --out icon_128x128@2x.png
sips -z 256 256   master.png --out icon_256x256.png
sips -z 512 512   master.png --out icon_256x256@2x.png
sips -z 512 512   master.png --out icon_512x512.png
sips -z 1024 1024 master.png --out icon_512x512@2x.png

For iOS (single 1024x1024):

cp master.png icon_1024x1024.png

2. Write Contents.json for the asset catalog

For macOS:

{
  "images": [
    { "filename": "icon_16x16.png", "idiom": "mac", "scale": "1x", "size": "16x16" },
    { "filename": "icon_16x16@2x.png", "idiom": "mac", "scale": "2x", "size": "16x16" },
    { "filename": "icon_32x32.png", "idiom": "mac", "scale": "1x", "size": "32x32" },
    { "filename": "icon_32x32@2x.png", "idiom": "mac", "scale": "2x", "size": "32x32" },
    { "filename": "icon_128x128.png", "idiom": "mac", "scale": "1x", "size": "128x128" },
    { "filename": "icon_128x128@2x.png", "idiom": "mac", "scale": "2x", "size": "128x128" },
    { "filename": "icon_256x256.png", "idiom": "mac", "scale": "1x", "size": "256x256" },
    { "filename": "icon_256x256@2x.png", "idiom": "mac", "scale": "2x", "size": "256x256" },
    { "filename": "icon_512x512.png", "idiom": "mac", "scale": "1x", "size": "512x512" },
    { "filename": "icon_512x512@2x.png", "idiom": "mac", "scale": "2x", "size": "512x512" }
  ],
  "info": { "author": "xcode", "version": 1 }
}

For iOS (single size, system generates others):

{
  "images": [
    { "filename": "icon_1024x1024.png", "idiom": "universal", "platform": "ios", "size": "1024x1024" }
  ],
  "info": { "author": "xcode", "version": 1 }
}

3. Copy files into the asset catalog directory 4. Build to verify: xcodebuild build -scheme <scheme> -destination 'platform=<platform>' -quiet

Step 5: Cleanup

  • Keep scripts/generate-icon.swift for future regeneration
  • Remove icon-variants/ directory (or add to .gitignore)

Category-Specific Design Recipes

Productivity Apps

  • Background: Deep blue (#0f1b3d) to teal (#1a4a6b)
  • Element: Checkmark, list, or document shape in white
  • Accent: Green checkmark or blue highlight
  • Style: Clean, minimal, professional

Creative/Media Apps

  • Background: Dark purple (#1a0533) to magenta (#6b1a5c)
  • Element: Camera lens, brush stroke, play button, or waveform
  • Accent: Red record dot, orange/yellow creative spark
  • Style: Vibrant, expressive

Developer Tools

  • Background: Near-black (#0d1117) to dark gray (#1a1a2e)
  • Element: Terminal bracket >_, code braces {}, or gear
  • Accent: Green (#34c759) or cyan (#00d4ff) terminal glow
  • Style: Monospace feel, technical

Communication Apps

  • Background: Blue (#0a2463) to lighter blue (#1e5aa8)
  • Element: Speech bubble, person silhouette, or connection lines
  • Accent: White or light blue
  • Style: Friendly, approachable

Utility Apps

  • Background: Dark gray (#1a1a2e) to medium gray (#2d2d44)
  • Element: Gear, wrench, shield, or lightning bolt
  • Accent: System blue (#007aff) or orange (#ff9500)
  • Style: Functional, trustworthy

Finance Apps

  • Background: Dark green (#0a2e1a) to emerald (#1a6b3a)
  • Element: Chart line, coin, or dollar symbol
  • Accent: Gold (#ffd60a) or green (#34c759)
  • Style: Secure, premium

Health/Fitness Apps

  • Background: Dark red (#2d1117) to pink (#6b1a3a)
  • Element: Heart, activity ring, or pulse line
  • Accent: Red (#ff3b30) or green (#34c759)
  • Style: Energetic, motivating

Education Apps

  • Background: Deep blue (#0f0c29) to royal blue (#302b63)
  • Element: Book, graduation cap, or lightbulb
  • Accent: Yellow (#ffd60a) or white
  • Style: Inspiring, trustworthy

Output Summary

After completion, report:

Icon installed successfully!

Master: scripts/generate-icon.swift (re-run to regenerate)
Sizes:  [list of sizes generated]
Location: [path to AppIcon.appiconset]

Build and run to see the icon in:
- Menu bar (macOS)
- Home screen (iOS)
- Finder / Spotlight
- About view

Iteration

If the user wants changes: 1. Modify the Swift script parameters (colors, shapes, sizes) 2. Re-run: swift scripts/generate-icon.swift 3. Show the updated variants 4. Resize and reinstall once approved

Common adjustment requests:

  • "Make the record dot bigger/smaller" → adjust radius parameter
  • "Different background color" → change gradient hex values
  • "Add more depth" → add radial glow or shine
  • "Too busy, simplify" → remove secondary elements
  • "Doesn't look good at small size" → increase stroke widths, simplify shapes

Related skills

This week in AI coding

Five minutes, every Monday - the tools, releases and tactics for developers.

unsubscribe anytime.