Icon Generation

---
name: icon-generation
description: Generate app icons (SVG/PNG) and launcher icons for Android Flutter apps. Use when creating UI icons, launcher icons, or platform-ready icon assets. Handles sizing, formats, and flutter_launcher_icons integration.
---

# Icon Generation Skill

Concise, reusable skill for generating app icons (SVG / PNG) and launcher icons for Android Flutter apps. Designed to work with LLMs (Copilot Chat) and image generation models (DALL·E, etc.).

## When to Use This Skill

- Creating consistent, accessible, and platform-ready icons
- Producing SVG markup or PNG assets
- Generating image-generation prompts for app icons
- Setting up launcher icons with flutter_launcher_icons

## Important Constraints (Project-Specific)

- Prefer vector first (SVG) whenever possible
- Keep icons simple and legible at small sizes (24x24, 48x48)
- Provide transparent backgrounds for app icons when requested
- Use the project's color palette or provide color recommendations with hex codes

## Flutter Icon Locations

### App Icons (Launcher)
- Android: `android/app/src/main/res/mipmap-*/` (ic_launcher.png)

### UI Icons
- Place in `assets/icons/` and register in `pubspec.yaml`
- Use Flutter's built-in Icons class when possible
- For custom icons, consider using flutter_svg package

## Icon Sizing

### Android Launcher (mipmap)
- mdpi: 48×48 px
- hdpi: 72×72 px
- xhdpi: 96×96 px
- xxhdpi: 144×144 px
- xxxhdpi: 192×192 px

### Master Icon
- 1024×1024 px for Play Store and source

## Example Prompts

### 1) Generate a small UI icon (SVG)

"Create a simple, single-color `search` icon for app UI (24x24). Provide:
- a clean SVG with viewBox 0 0 24 24 and a compact single-path
- recommended filename `assets/icons/ic_search.svg`
- one-line alt text for accessibility
Constraints: single color (use #1F2937 or suggest a high-contrast color)."

### 2) Generate app launcher icon

"Design an app launcher icon for a Notes app — style: flat, minimal, rounded corners, primary accent color #0057D9. Provide:
- a 1024×1024 source image
- export-ready PNG files for all Android mipmap sizes
- alt text and recommended filenames
Constraints: simple silhouette, good contrast at small sizes."

### 3) Image-generation prompt

"Create a clean, flat-style app icon. Requirements:
- Transparent or solid background (specify preference)
- Simple two-tone palette: primary #0EA5E9, secondary #0F172A
- Minimalist symbol, centered, no text
- Provide outputs: PNG 1024x1024 (source), then resize for Android mipmap sizes
Negative prompts: avoid photorealism, gradients, text, heavy shadows."

## Using flutter_launcher_icons

For automated icon generation, use the flutter_launcher_icons package:

1. Add to `pubspec.yaml`:
```yaml
dev_dependencies:
  flutter_launcher_icons: ^0.13.1

flutter_launcher_icons:
  android: true
  image_path: "assets/icon/app_icon.png"
```

2. Run: `flutter pub run flutter_launcher_icons`

## Tips

- Always include primary color hex code and alternate suggestions
- For UI icons, keep viewBox within 24x24 or 48x48
- Test icons at small sizes to ensure legibility
- Consider dark/light mode variations