Installation
npx skills add b-open-io/gemskills --skill generate-icon 46
Installs
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/uiPresets
| 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 presetsExamples
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 ./iconsUsing 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 ./iconsiOS 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/iosIcon 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" |
Installs
Security Audit
View Source
b-open-io/gemskills
More from this source
Power your AI Agents with
the best open-source models.
Drop-in OpenAI-compatible API. No data leaves Europe.
Explore Inference APIGLM
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
How to use this skill
Install generate-icon by running npx skills add b-open-io/gemskills --skill generate-icon in your project directory. Run the install command above in your project directory. The skill file will be downloaded from GitHub and placed in your project.
No configuration needed. Your AI agent (Claude Code, Cursor, Windsurf, etc.) automatically detects installed skills and uses them as context when generating code.
The skill enhances your agent's understanding of generate-icon, helping it follow established patterns, avoid common mistakes, and produce production-ready output.
What you get
Skills are plain-text instruction files — not executable code. They encode expert knowledge about frameworks, languages, or tools that your AI agent reads to improve its output. This means zero runtime overhead, no dependency conflicts, and full transparency: you can read and review every instruction before installing.
Compatibility
This skill works with any AI coding agent that supports the skills.sh format, including Claude Code (Anthropic), Cursor, Windsurf, Cline, Aider, and other tools that read project-level context files. Skills are framework-agnostic at the transport level — the content inside determines which language or framework it applies to.
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.