Icon Generator

icon-generator

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 ...

majiayu000/claude-skill-registry·0installs663starsProductivity & Planning

SKILL.md

Full skill instructions

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

Pick target(s): Web UI/UX (favicon + PWA icons) and/or Unreal Engine packaging (optional).
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).
Generate the assets using scripts/generate_icons.py.

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

Unreal Engine formats and expectations: references/unreal-engine.md

Full size tables: references/icon-sizes.md

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
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 <head> snippets, manifest.webmanifest examples, and maskable safe-area guidance, read:

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.

Install skill

Copy and run in your terminal

npx -y skills add https://github.com/majiayu000/claude-skill-registry --skill icon-generator

View on GitHub

skills/data/icon-generator/SKILL.md

More Productivity & Planning skills

View all

Productivity & Planning

brainstorming

Structured design dialogue that validates ideas before implementation begins.

295.4K 385.7K

View

Productivity & Planning

ui-ux-pro-max

Comprehensive design intelligence for web and mobile UI/UX across 10 technology stacks.

133.1K 383.9K

View

Productivity & Planning

writing-plans

Comprehensive implementation plans for multi-step tasks, breaking down specs into bite-sized, testable steps.

295.4K 268K

View

Productivity & Planning

using-superpowers

Introduction to the obra skills system with mandatory skill invocation rules and best practices.

295.4K 259.8K

View

Productivity & Planning

executing-plans

Execute a written implementation plan with critical review and task checkpoints.

295.4K 229.1K

View

Productivity & Planning

dispatching-parallel-agents

Delegate independent tasks to specialized agents working concurrently with isolated context.

295.4K 206.3K

View

Productivity & Planning

using-git-worktrees

Isolated git worktrees with smart directory selection and safety verification.

295.4K 205.2K

View

Productivity & Planning

webapp-testing

Toolkit for interacting with and testing local web applications using Playwright. Supports verifying frontend functionality, debugging UI behavior, capturing browser screenshots, and viewing browser logs.

179.7K 170.6K

View