
Ios Icon Gen
Generate 1x/2x/3x PNG imagesets for Xcode asset catalogs from SF Symbols or the Iconify API.
Overview
ios-icon-gen is an agent skill for the Build phase that generates Xcode-compatible PNG icon imagesets from SF Symbols or the Iconify API.
Install
npx skills add https://github.com/affaan-m/everything-claude-code --skill ios-icon-genWhat is this skill?
- Two icon sources: Iconify API (275,000+ icons, 200+ collections) and SF Symbols (5,000+ Apple-native)
- Identical Xcode imageset output: Contents.json plus 1x, 2x, and 3x PNGs
- Default 1x size 68px called out in the imageset layout
- Workflow step to match existing project icon size, color, and weight before generating
- Iconify path needs network; SF Symbols path is macOS-only offline
- Iconify API: 275,000+ icons from 200+ collections
- SF Symbols: 5,000+ Apple-native symbols
- Imagesets include 1x, 2x, and 3x PNG variants
Adoption & trust: 1.2k installs on skills.sh; 210k GitHub stars; 3/3 security scanners passed (skills.sh audits).
What problem does it solve?
You have an iOS or macOS Xcode project but only placeholders or mismatched icon scales in the asset catalog.
Who is it for?
Indie app developers replacing placeholder icons and standardizing tab/toolbar assets before TestFlight or App Store submission.
Skip if: Android-only or React Native projects that do not use Xcode asset catalogs, or marketing store icons that need separate full-bleed App Icon sets without following this imageset flow.
When should I use this skill?
Generating icon assets, creating icon imagesets, adding icons to an asset catalog, or searching icons for iOS or macOS Xcode projects.
What do I get? / Deliverables
You get complete .imageset folders with Contents.json and 1x/2x/3x PNGs aligned to your project’s visual style.
- Named .imageset with Contents.json
- 1x, 2x, and 3x PNG files
Recommended Skills
Journey fit
How it compares
Skill-driven asset generation for in-app symbols, not a Figma-to-marketing-icon export pipeline.
Common Questions / FAQ
Who is ios-icon-gen for?
Solo builders using Xcode who want catalog-ready PNG imagesets without manually exporting multiple scales from design tools.
When should I use ios-icon-gen?
During Build while adding or refreshing icons in an asset catalog, searching open-source collections, or matching SF Symbol styling for Apple-native UI.
Is ios-icon-gen safe to install?
Iconify mode calls an external API over the network; review the Security Audits panel on this page and avoid sending proprietary icon briefs you cannot disclose.
SKILL.md
READMESKILL.md - Ios Icon Gen
# iOS Icon Generator Generate PNG icon imagesets for Xcode asset catalogs from two sources. ## When to Activate - Generating icon assets for an iOS/macOS Xcode project - Searching for icons across open source collections - Creating PNG imagesets (1x, 2x, 3x) for asset catalogs - Replacing placeholder icons with production-quality assets - Matching existing icon styles in an Xcode project ## Core Principles ### 1. Two Sources, One Output Format Both sources produce identical Xcode-compatible imagesets. Choose based on need: | Source | Icons | Requires | Best for | |--------|-------|----------|----------| | **Iconify API** | 275,000+ from 200+ collections | Internet | Wide selection, specific styles, open source icons | | **SF Symbols** | 5,000+ Apple symbols | macOS only | Apple-native style, offline use | ### 2. Always Match Existing Style Before generating, check the project's existing icons for size, color, and weight consistency. ### 3. Output Structure Both methods produce a complete Xcode imageset: ``` <output-dir>/<asset-name>.imageset/ Contents.json <asset-name>.png # 1x (68px default) <asset-name>@2x.png # 2x (136px default) <asset-name>@3x.png # 3x (204px default) ``` ## Examples ### Step 1: Assess Requirements Determine icon needs: what the icon represents, preferred style, target color, and size. If the project already has icons, check existing style: ```bash # Check dimensions of existing icon sips -g pixelWidth -g pixelHeight path/to/existing@2x.png ``` ### Step 2: Search for Icons **Iconify API (recommended for wide selection):** ```bash # Search all collections $SKILL_DIR/scripts/iconify_gen.sh search "receipt" # Search within a specific collection $SKILL_DIR/scripts/iconify_gen.sh search "business card" --prefix mdi # List available collections $SKILL_DIR/scripts/iconify_gen.sh collections ``` **SF Symbols (for Apple-native style):** Browse the SF Symbols app or reference common names: | Use Case | Symbol Name | |----------|-------------| | Document | `doc.text`, `doc.fill` | | Receipt | `doc.text.below.ecg`, `receipt` | | Person | `person.crop.rectangle`, `person.text.rectangle` | | Camera | `camera`, `camera.fill` | | Scan | `doc.viewfinder`, `qrcode.viewfinder` | | Settings | `gearshape`, `slider.horizontal.3` | ### Step 3: Preview (Optional) ```bash # Iconify preview $SKILL_DIR/scripts/iconify_gen.sh preview mdi:receipt-text-outline ``` ### Step 4: Generate **Iconify API:** ```bash # Basic generation $SKILL_DIR/scripts/iconify_gen.sh mdi:receipt-text-outline editTool_expenseReport # Custom color and output location $SKILL_DIR/scripts/iconify_gen.sh mdi:receipt-text-outline myIcon --color 007AFF --output ./Assets.xcassets/icons ``` Options: `--size <pt>` (default: 68), `--color <hex>` (default: 8E8E93), `--output <dir>` (default: /tmp/icons) **SF Symbols:** ```bash # Basic generation swift $SKILL_DIR/scripts/generate_icons.swift doc.text.below.ecg editTool_expenseReport # Custom color, weight, and output swift $SKILL_DIR/scripts/generate_icons.swift person.crop.rectangle myIcon --color 007AFF --weight regular --output ./Assets.xcassets/icons ``` Options: `--size <pt>` (default: 68), `--color <hex>` (default: 8E8E93), `--weight <name>` (default: thin), `--output <dir>` (default: /tmp/icons) ### Step 5: Verify and Integrate 1. Read the generated @2x PNG to verify visually 2. Copy to asset catalog if not output there directly: ```bash cp -r /tmp/icons/<name>.imageset path/to/Assets.xcassets/<group>/ ``` 3. Build the project to verify Xcode picks up the new assets ## Popular Iconify Collections | Prefix | Name