Vibe Index
🎯

icon-generator

🎯Skill

from ssdeanx/ai-skills

VibeIndex|
What it does

Generates multi- 🌯 icon assets for web ((favicon,, PW)A 🎮 unEngine from a single source single source icon file

📦

Part of

ssdeanx/ai-skills(5 items)

icon-generator

Installation

git cloneClone repository
git clone https://github.com/ssdeanx/AI-Skills.git ~/.opencode
PythonRun Python server
python skills/skill-creator/scripts/init_skill.py my-new-skill --path skills
PythonRun Python server
python skills/skill-creator/scripts/quick_validate.py skills/my-new-skill
PythonRun Python server
python skills/skill-creator/scripts/package_skill.py skills/my-new-skill
📖 Extracted from docs: ssdeanx/ai-skills
Need more details? View full documentation on GitHub →
2Installs
-
AddedFeb 4, 2026
View on GitHubBack to Skills

Skill Details

SKILL.md

Generate web UI/UX icon assets (favicon.ico, apple-touch-icon, PWA icons incl. maskable) and optionally Unreal Engine packaging icons (Windows .ico, macOS .iconset/.icns, Linux .png) from a single source SVG/PNG; use when you need correct multi-size icon files, safe-area guidance, manifests/head tags, or automation.

Overview

# Icon Generator

You generate icon asset bundles for web UI/UX first (favicons + PWA icons), and you can also generate Unreal Engine packaging icon assets when needed.

Fast workflow

  1. Pick target(s): Web UI/UX (favicon + PWA icons) and/or Unreal Engine packaging (optional).
  1. Pick the source icon: prefer a 1024x1024 PNG (square) or a clean SVG. If it's not square, choose whether to crop or pad (default: pad).
  1. Generate the assets using [scripts/generate_icons.py](scripts/generate_icons.py).

Web/PWA sizes and safe-area rules: [references/web-ui-ux.md](references/web-ui-ux.md)

Unreal Engine formats and expectations: [references/unreal-engine.md](references/unreal-engine.md)

Full size tables: [references/icon-sizes.md](references/icon-sizes.md)

  1. Verify output quality: ensure the .ico contains multiple sizes, and the 16/24/32 px variants are crisp.

Quality rules (what "good" looks like)

  • Design for small sizes: avoid thin strokes, tiny text, and busy details.
  • Prefer transparent backgrounds for desktop icons unless you intentionally "plate" the icon.
  • Preview at 16px and 24px. If it becomes muddy, create a simpler variant.

Automation (recommended)

Run and customize the script:

  • Script: [scripts/generate_icons.py](scripts/generate_icons.py)
  • It supports:

- Web/PWA set: favicon.ico, apple-touch-icon.png, icon-192.png, icon-512.png, icon-maskable-512.png

- UE sets (optional): Windows .ico, macOS .iconset, Linux .png

If you need HTML snippets, manifest.webmanifest examples, and maskable safe-area guidance, read:

  • [references/web-ui-ux.md](references/web-ui-ux.md)

Notes

  • If your input is SVG and Python SVG rasterization is unavailable on your machine, export a 1024x1024 PNG first (e.g., Inkscape), then rerun the script using the PNG.
  • Keep this SKILL.md lean; detailed size tables live in the reference files.

More from this repository4

🎯
skill-creator🎯Skill

Guides users through creating effective skills that extend Claude's capabilities with specialized knowledge, workflows, and tool integrations.

🎯
task-generator🎯Skill

Generates structured, actionable task lists with parent and sub-tasks from project specifications, guiding developers through implementation.

🎯
web-ui-ux🎯Skill

web-ui-ux skill from ssdeanx/ai-skills

🎯
hello-world🎯Skill

Introduces beginners to OpenCode skill development by providing a welcome message and step-by-step guidance for creating skills.