#601

Globales Ranking · von 601 Skills

generate-icon AI Agent Skill

Safe

Installation

npx skills add b-open-io/gemskills --skill generate-icon

Installationen

Generate Icon Skill

Generate professional icons for any platform using Gemini AI with automatic background removal, cropping, and multi-size export.

Quick Start

# Favicon for website
bun run --cwd ${CLAUDE_PLUGIN_ROOT} ${CLAUDE_PLUGIN_ROOT}/skills/generate-icon/scripts/generate.ts "modern tech startup logo letter S" --preset favicon --output ./icons/favicon

# iOS App Store icons
bun run --cwd ${CLAUDE_PLUGIN_ROOT} ${CLAUDE_PLUGIN_ROOT}/skills/generate-icon/scripts/generate.ts "meditation app lotus flower" --preset apple-app-icon --output ./icons/ios

# Android Play Store + adaptive icons
bun run --cwd ${CLAUDE_PLUGIN_ROOT} ${CLAUDE_PLUGIN_ROOT}/skills/generate-icon/scripts/generate.ts "fitness tracker flame icon" --preset android-app-icon --output ./icons/android

# PWA manifest icons
bun run --cwd ${CLAUDE_PLUGIN_ROOT} ${CLAUDE_PLUGIN_ROOT}/skills/generate-icon/scripts/generate.ts "productivity app checkmark" --preset pwa --output ./icons/pwa

# macOS desktop app
bun run --cwd ${CLAUDE_PLUGIN_ROOT} ${CLAUDE_PLUGIN_ROOT}/skills/generate-icon/scripts/generate.ts "code editor brackets symbol" --preset macos-icns --output ./icons/macos

# Windows desktop app
bun run --cwd ${CLAUDE_PLUGIN_ROOT} ${CLAUDE_PLUGIN_ROOT}/skills/generate-icon/scripts/generate.ts "music player note icon" --preset windows-ico --output ./icons/windows

# General UI icons
bun run --cwd ${CLAUDE_PLUGIN_ROOT} ${CLAUDE_PLUGIN_ROOT}/skills/generate-icon/scripts/generate.ts "settings gear" --preset ui-icons --output ./icons/ui

Presets

Preset	Description	Sizes	Bundle
`apple-app-icon`	iOS/iPadOS App Store	18 sizes (1024-20px)	No
`android-app-icon`	Google Play + adaptive layers	11 sizes + foreground	No
`favicon`	Browser tab icons	8 sizes + ICO	Yes (.ico)
`pwa`	Progressive Web App	11 sizes + maskable	No
`macos-icns`	macOS desktop	10 sizes	Yes (.icns)
`windows-ico`	Windows desktop	7 sizes	Yes (.ico)
`ui-icons`	In-app icons	9 sizes (512-16px)	No

Pipeline

Generate - Creates master icon at high resolution via Gemini
Remove Background - Uses Replicate rembg for clean edges
Crop & Center - Trims whitespace, centers on square canvas with 5% padding
Resize - Exports all preset sizes with lanczos3 interpolation
Bundle - Creates ICO/ICNS bundles where needed

Options

bun run --cwd ${CLAUDE_PLUGIN_ROOT} ${CLAUDE_PLUGIN_ROOT}/skills/generate-icon/scripts/generate.ts "prompt" --preset <name> --output <dir> [options]

Required:
  --preset <name>       Platform preset (see table above)
  --output <dir>        Output directory

Optional:
  --input <image>       Reference image for style guidance
  --master-image <path> Use existing master instead of generating
  --skip-generate       Skip AI generation (requires --master-image)
  --skip-remove-bg      Skip background removal
  --bg-color <hex>      Background color for non-transparent presets

Examples

Using a reference image

bun run --cwd ${CLAUDE_PLUGIN_ROOT} ${CLAUDE_PLUGIN_ROOT}/skills/generate-icon/scripts/generate.ts "clean app icon version" --preset pwa --input ./existing-logo.png --output ./icons

Using an existing master

bun run --cwd ${CLAUDE_PLUGIN_ROOT} ${CLAUDE_PLUGIN_ROOT}/skills/generate-icon/scripts/generate.ts "" --preset ui-icons --master-image ./my-icon.png --skip-generate --output ./icons

iOS with custom background color

bun run --cwd ${CLAUDE_PLUGIN_ROOT} ${CLAUDE_PLUGIN_ROOT}/skills/generate-icon/scripts/generate.ts "weather app sun" --preset apple-app-icon --bg-color "#0066CC" --output ./icons/ios

Icon Design Tips

DO:

Simple, bold, recognizable silhouette
Single focal point
High contrast
Clean edges
Works at 16x16px

DON'T:

Fine details that disappear at small sizes
Text (unreadable at icon sizes)
Complex gradients (banding issues)
Multiple competing elements
Photos or realistic images

Environment Variables

Variable	Required	Description
`GEMINI_API_KEY`	Yes	Google AI Studio API key
`REPLICATE_API_TOKEN`	Yes	Replicate API token for background removal

Output Structure

output/
├── master-raw.png        # Original generated image
├── master-nobg.png       # Background removed
├── master-cropped.png    # Cropped and centered
├── master-final.png      # With background (iOS only)
├── favicon.ico           # ICO bundle (favicon preset)
├── AppIcon.icns          # ICNS bundle (macos preset)
├── icon-512.png          # Size variants...
├── icon-256.png
└── ...

Context Discipline

Do not read generated icon images back into context. The script outputs file paths for all generated sizes. Ask the user to visually inspect the results. Icon sets produce many files across multiple sizes - reading them back would quickly exhaust the context window.

Troubleshooting

Issue	Solution
"GEMINI_API_KEY not set"	Export your API key: `export GEMINI_API_KEY=your-key`
"REPLICATE_API_TOKEN not set"	Export your token: `export REPLICATE_API_TOKEN=your-token`
ICO not generated	Install ImageMagick: `brew install imagemagick`
ICNS not generated	Only works on macOS (requires iconutil)
Background not removed cleanly	Try a simpler prompt with solid background
Icon too complex	Simplify prompt, avoid "detailed" or "realistic"

Installationen

Installationen 46

Globales Ranking #601 von 601

Sicherheitsprüfung

ath Safe

socket Safe

Warnungen: 0 Bewertung: 90

snyk Low

Quellcode ansehen

b-open-io/gemskills

Mehr aus dieser Quelle

EU-Hosted Inference API

Power your AI Agents with
the best open-source models.

Drop-in OpenAI-compatible API. No data leaves Europe.

Explore Inference API

GLM

GLM 5

$1.00 / $3.20

per M tokens

Kimi

Kimi K2.5

$0.60 / $2.80

per M tokens

MiniMax

MiniMax M2.5

$0.30 / $1.20

per M tokens

Qwen

Qwen3.5 122B

$0.40 / $3.00

per M tokens

So verwenden Sie diesen Skill

Install generate-icon by running npx skills add b-open-io/gemskills --skill generate-icon in your project directory. Führen Sie den obigen Installationsbefehl in Ihrem Projektverzeichnis aus. Die Skill-Datei wird von GitHub heruntergeladen und in Ihrem Projekt platziert.

Keine Konfiguration erforderlich. Ihr KI-Agent (Claude Code, Cursor, Windsurf usw.) erkennt installierte Skills automatisch und nutzt sie als Kontext bei der Code-Generierung.

Der Skill verbessert das Verständnis Ihres Agenten für generate-icon, und hilft ihm, etablierte Muster zu befolgen, häufige Fehler zu vermeiden und produktionsreifen Code zu erzeugen.

Was Sie erhalten

Skills sind Klartext-Anweisungsdateien — kein ausführbarer Code. Sie kodieren Expertenwissen über Frameworks, Sprachen oder Tools, das Ihr KI-Agent liest, um seine Ausgabe zu verbessern. Das bedeutet null Laufzeit-Overhead, keine Abhängigkeitskonflikte und volle Transparenz: Sie können jede Anweisung vor der Installation lesen und prüfen.

Kompatibilität

Dieser Skill funktioniert mit jedem KI-Coding-Agenten, der das skills.sh-Format unterstützt, einschließlich Claude Code (Anthropic), Cursor, Windsurf, Cline, Aider und anderen Tools, die projektbezogene Kontextdateien lesen. Skills sind auf Transportebene framework-agnostisch — der Inhalt bestimmt, für welche Sprache oder welches Framework er gilt.

Data sourced from the skills.sh registry and GitHub. Install counts and security audits are updated regularly.

Made in Europe

Chat with 100+ AI Models in one App.

Use Claude, ChatGPT, Gemini alongside with EU-Hosted Models like Deepseek, GLM-5, Kimi K2.5 and many more.

Start for free View pricing

App herunterladen:

generate-icon AI Agent Skill

Generate Icon Skill

Quick Start

Presets

Pipeline

Options

Examples

Using a reference image

Using an existing master

iOS with custom background color

Icon Design Tips

Environment Variables

Output Structure

Context Discipline

Troubleshooting

Installationen

Sicherheitsprüfung

Quellcode ansehen

Power your AI Agents with the best open-source models.

So verwenden Sie diesen Skill

Was Sie erhalten

Kompatibilität

Chat with 100+ AI Models in one App.

Power your AI Agents with
the best open-source models.