flutter-icon
- Repo stars 0
- Author updated Live
- Author repo skills-registry
- Domain
- Design
- Compatible agents
-
- Claude Code
- Cursor
- Cline
- Codex
- Windsurf
- Gemini CLI
- +20
- Trust score
- 88 / 100 · community maintained
- Author / version / license
- @tomevault-io · no license declared
- Token usage
- Lean
- Setup complexity
- Plug-and-play
- External API key
- Not required
- Operating systems
- Unspecified (assume cross-platform)
- Runtime requirements
- Python
- Permissions
-
- Read-only
- Write / modify
- Network behavior
- Local-only
- Install commands
- 26 variants
Profile is derived at build time from SKILL.md and install vectors. Subject to drift from author intent.
Heads up: 未限定 allowed-tools，默认拥有全部工具权限。
---
name: flutter-icon
description: Generates or updates Flutter app icons correctly for Android adaptive icons and iOS full-bleed.…
category: design
runtime: Python
---
# flutter-icon output preview
## PART A: Task fit
- Use case: Generates or updates Flutter app icons correctly for Android adaptive icons and iOS full-bleed. Use when changing, creating, or redesigning a Flutter app icon, updating launcher icons, or fixing the "icon inside icon" double-border bug on Android..
- Inputs: target material, constraints, expected output, and acceptance criteria.
- Evidence boundary: follow “Arguments / Rules — read before touching any file / Why these rules exist” and do not present inference as author intent.
## PART B: Execution result
- **01** The card summarizes the use case; runtime output centers on “Generates or updates Flutter app icons correctly for Android adaptive icons and iOS full-bleed. Use when changing, creating, or redesigning a Flutter app icon, updating launcher icons, or fixing the "icon inside icon" double-border bug on Android.”.
- **02** When the source has headings, the agent prioritizes “Arguments / Rules — read before touching any file / Why these rules exist” so the result follows the author’s structure.
- **03** Typical output includes task judgment, concrete steps, required commands or file edits, validation, and follow-up options.
- **04** Risk context follows the fingerprint: read files, write/modify files; mostly runs locally; usually needs no extra API key.
## Running Rules
- read files, write/modify files; mostly runs locally; usually needs no extra API key.
- Validate with a small sample before expanding scope.
- Return the result, validation criteria, and next iteration options. Choose the trigger
The source does not require a stable slash command. After installation, invoke the skill by name and describe the task.
Provide inputs and boundaries
Name target files or source material, expected output, forbidden changes, and whether network or shell access is allowed. Permission fingerprint: read files, write/modify files.
Validate with a small run
Start with a small task and check whether the result follows “Arguments / Rules — read before touching any file / Why these rules exist”. Inspect diffs, logs, previews, or tests before expanding scope.
Review before delivery
Confirm the final output includes a concrete result, evidence, and next action. If it stays generic, tighten inputs, boundaries, and acceptance criteria.
---
name: flutter-icon
description: Generates or updates Flutter app icons correctly for Android adaptive icons and iOS full-bleed.…
category: design
source: tomevault-io/skills-registry
---
# flutter-icon
## When to use
- Generates or updates Flutter app icons correctly for Android adaptive icons and iOS full-bleed. Use when changing, cre…
- Use it when the task has clear inputs, repeatable steps, and validation criteria.
## What to provide
- Target material, scope, expected result, and forbidden changes.
- Whether network, commands, file writes, or external services are allowed.
## Execution rules
- Organize steps around “Arguments / Rules — read before touching any file / Why these rules exist” and keep inference separate from source facts.
- read files, write/modify files; mostly runs locally; usually needs no extra API key.
- Validate with a small sample before expanding the task.
## Output requirements
- Return the deliverable, key evidence, validation method, and next action.
- Mark missing information as unknown; do not invent commands, platforms, or dependencies. Evidence boundary and execution chain
The author source anchors workflow facts; repository files anchor sources and commands; Fluxly only adds fit, limitations, and quality judgment.
skill "flutter-icon" {
input -> user goal + target files + boundaries + acceptance criteria
context -> Arguments / Rules — read before touching any file / Why these rules exist
rules -> SKILL.md triggers / order / output contract
runtime -> Python | read files, write/modify files | mostly runs locally
guardrails -> usually needs no extra API key + small-sample validation + diff/log review
output -> copyable result + checklist + next iteration
}Flutter App Icon Generator
Generate or update the app icon for a Flutter project correctly across Android (adaptive) and iOS (full-bleed).
Arguments
$ARGUMENTS — Optional description of the desired icon design. If empty, redesign the existing icon or use a sensible default for the project.
Rules — read before touching any file
Why these rules exist
- Android API 26+ uses adaptive icons: the OS composites a foreground layer (PNG with transparent bg) over a background layer (solid color or image) and then clips both with a shape mask (squircle, circle, etc.). If you bake rounded corners into the source image, Android clips it again → "icon inside icon."
- iOS applies its own squircle mask to a full-bleed square. Pre-baked rounded corners leave visible corner padding inside the squircle → same inset problem.
Correct approach
| Asset | Background | Rounded corners | Notes |
|---|---|---|---|
app_icon_ios.png |
Full-bleed solid color | ❌ None | iOS adds its own mask |
app_icon_foreground.png |
Transparent (RGBA) | ❌ None | Android foreground layer; content must fit inside safe zone |
Android safe zone: the center 72/108 = 66.7% of the canvas is always visible regardless of mask shape. Keep all meaningful content (outer_r, etc.) within that region. For a 1024 px canvas: safe = 683 px, so outer_r ≤ 340.
Steps
1. Check prerequisites
python3 -c "from PIL import Image; print('ok')" 2>/dev/null || pip3 install PillowCheck pubspec.yaml for flutter_launcher_icons in dev_dependencies. If absent, add it:
dev_dependencies:
flutter_launcher_icons: ^0.14.12. Create icon assets directory
mkdir -p assets/icon3. Generate icon PNGs with Python/Pillow
Write and run a Python script that produces two files:
assets/icon/app_icon_ios.png — 1024×1024, full-bleed square
from PIL import Image, ImageDraw
size = 1024
img = Image.new('RGBA', (size, size), BACKGROUND_COLOR) # solid fill, no rounded_rectangle
draw = ImageDraw.Draw(img)
# ... draw design centered on canvas ...
img.save('assets/icon/app_icon_ios.png')- Use
Image.new('RGBA', (size, size), bg_color)for the background — notdraw.rounded_rectangle. - Design fills edge-to-edge; iOS clips to squircle automatically.
assets/icon/app_icon_foreground.png — 1024×1024, transparent background
fg = Image.new('RGBA', (size, size), (0, 0, 0, 0)) # fully transparent
draw = ImageDraw.Draw(fg)
# ... draw design centered, scaled so outer_r ≤ 340 for 1024px canvas ...
# When cutting out a center hole in a donut, fill with (0,0,0,0) not the bg color
fg.save('assets/icon/app_icon_foreground.png')- Background must be transparent —
(0, 0, 0, 0). - Any "hole" in the design (donut center, gaps) must also be
(0, 0, 0, 0). - Scale all radii/sizes proportionally so content stays inside the 683 px safe zone.
4. Update pubspec.yaml
Set the flutter_launcher_icons section to:
flutter_launcher_icons:
android: true
ios: true
image_path_android: "assets/icon/app_icon_ios.png" # legacy Android (API < 26)
image_path_ios: "assets/icon/app_icon_ios.png"
adaptive_icon_background: "#RRGGBB" # match the bg color used in app_icon_ios.png
adaptive_icon_foreground: "assets/icon/app_icon_foreground.png"
min_sdk_android: 21
remove_alpha_ios: trueimage_path_android(legacy) andimage_path_iosmust both be present — the tool errors if either is missing when using the split-path form.adaptive_icon_backgroundis a hex color string matching the background ofapp_icon_ios.png.- Do not use the single
image_pathkey when you also set adaptive icon keys.
5. Run the generator
flutter pub get && dart run flutter_launcher_iconsExpected output includes:
• Creating adaptive icons Android• Creating mipmap xml file Android✓ Successfully generated launcher icons
Verify that android/app/src/main/res/mipmap-anydpi-v26/ic_launcher.xml was created — this is the adaptive icon XML. If it's missing, the Android "icon inside icon" bug is not fixed.
6. Verify
After running, confirm:
android/app/src/main/res/mipmap-anydpi-v26/ic_launcher.xmlexists and references@color/ic_launcher_background+@drawable/ic_launcher_foregroundandroid/app/src/main/res/values/colors.xmlcontains theic_launcher_backgroundcolorios/Runner/Assets.xcassets/AppIcon.appiconset/contains updated PNGs
Common mistakes to avoid
- ❌ Drawing the background with
draw.rounded_rectangle(...)— causes double-rounding on both platforms - ❌ Filling the donut center hole with the background color in the foreground PNG — should be
(0,0,0,0) - ❌ Omitting
image_path_androidwhen usingimage_path_ios— tool will error - ❌ Making
outer_r > 340on a 1024px foreground — content gets clipped by aggressive masks (circle) - ❌ Using a single
image_pathfor both platforms — loses adaptive icon support on Android
Source: albertopeam/macro-tracker — distributed by TomeVault.
Decide Fit First
Design Intent
How To Use It
Boundaries And Review