Export a full app-icon and favicon set at every platform size

STAFF LISA · V0.1.0

gemskills:generate-icongemskills:optimize-images

REQUIRES

claude plugin install gemskills@b-open-io

WHEN TO REACH FOR THIS

You are about to submit to the App Store, Play Store, or ship a PWA, and you need every icon size and format the platforms demand. This produces the whole set (iOS, Android adaptive, PWA maskable, macOS .icns, Windows .ico, favicon bundle) from one prompt or one existing logo, already cropped, background-removed, bundled, and compressed.

REQUIRES

gemskills plugin: claude plugin install gemskills@b-open-io
GEMINI_API_KEY (Google AI Studio) - icon generation
REPLICATE_API_TOKEN - background removal (rembg step)
ImageMagick for .ico bundles (brew install imagemagick); .icns is macOS-only

CONTEXT INPUTS

{{ICON_CONCEPT}}  One-line mark, e.g. "bold letter S, single color". Must read at 16x16.
{{BRAND_COLOR}}   Hex background for opaque presets (iOS), e.g. #0066CC. Omit for transparent.
{{EXISTING_LOGO}} Optional path to an existing logo to use as the master.
{{PLATFORMS}}     Targets from: apple-app-icon, android-app-icon, pwa, macos-icns, windows-ico, favicon, ui-icons.
{{OUTPUT_DIR}}    Where the icon sets land, e.g. ./public/icons.

THE PROMPT

PASTE INTO YOUR AGENT

You are Lisa, our Visual Content Specialist. Produce a complete, platform-correct
app-icon set. Do not hand-resize anything - generate-icon exports every size.

Load `gemskills:generate-icon` and follow its pipeline (generate -> remove bg ->
crop/center -> resize -> bundle). Work one preset at a time from {{PLATFORMS}}, each
into its own subfolder under {{OUTPUT_DIR}}:
  bun run --cwd $CLAUDE_PLUGIN_ROOT $CLAUDE_PLUGIN_ROOT/skills/generate-icon/scripts/generate.ts "{{ICON_CONCEPT}}" --preset <preset> --output {{OUTPUT_DIR}}/<preset>

Generate ONE master, then reuse it across presets by passing --master-image
<path-to-master> --skip-generate together (--skip-generate requires
--master-image) so every platform shares pixel-identical art without
regenerating. If {{EXISTING_LOGO}} is given, use it as the master the same way:
--master-image {{EXISTING_LOGO}} --skip-generate. Follow the skill's icon rules: one focal point, high contrast, no
text, nothing that dies at 16x16 - simplify {{ICON_CONCEPT}} if it names gradients
or text. Opaque presets (apple-app-icon) get --bg-color "{{BRAND_COLOR}}"; leave
PWA/favicon transparent. Then load `gemskills:optimize-images` over {{OUTPUT_DIR}}
(overwrites only when smaller). Verify each preset produced its full size ladder
plus any bundle; do NOT read icons back into context - list the tree and savings
table and ask me to eyeball the 16px favicon and 1024px master.

Negative prompts: do not invent sizes the presets don't define; do not skip the
background-removal or optimization steps; do not add text to the mark; do not
upscale a low-res {{EXISTING_LOGO}} - if it's below the master size, stop and say so.

EXPECTED OUTPUT

A populated {{OUTPUT_DIR}} with one subfolder per preset, each holding the full size ladder plus .ico/.icns bundles where applicable, all compressed, plus a file tree and savings summary. No manual resizing left before submission.

FOLLOW-UP CHAIN

db-visual-identity-spec - lock the mark and usage rules so this set stays canonical.
db-asset-pipeline-manifest - record these export sizes and paths for the next batch.
db-native-desktop-ui - if the icons are for a desktop app, build its native UI.

← PACK CONTENTS