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

Use this to generate app icons from a prompt or an existing logo. Choose the target platforms: iOS, Android adaptive, PWA maskable, macOS .icns, Windows .ico, or favicons. The workflow handles background removal, cropping, resizing, bundling, and compression.

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