skillZs
LIVE SKILL TAGS
>>> LIVE SKILLS INDEX <<<
* OPEN SOURCE *
NO LOGIN, NO TRACKING
REAL INSTALL DATA
← back to all skills
affaan-m/everything-claude-code1.7k installs

ios-icon-gen

Generate iOS app icons as PNG imagesets for Xcode asset catalogs from SF Symbols (5000+ Apple-native) or Iconify API (275k+ open source icons from 200+ collections). Use when generating icons, creating icon assets, adding icons to asset catalog, or searching for icons for iOS projects.

How do I install this agent skill?

npx skills add https://github.com/affaan-m/everything-claude-code --skill ios-icon-gen
view source ↗

Is this agent skill safe to install?

  • Gen Agent Trust Hubpass

    This skill provides utilities for generating iOS app icons from SF Symbols and the Iconify API. It uses local scripts to automate icon fetching, image conversion via built-in macOS tools, and packaging into Xcode asset catalogs. No malicious patterns or security risks were identified.

  • Socketpass

    No alerts

  • Snykpass

    Risk: LOW · No issues

What does this agent skill do?

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:

SourceIconsRequiresBest for
Iconify API275,000+ from 200+ collectionsInternetWide selection, specific styles, open source icons
SF Symbols5,000+ Apple symbolsmacOS onlyApple-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:

# 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):

# 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 CaseSymbol Name
Documentdoc.text, doc.fill
Receiptdoc.text.below.ecg, receipt
Personperson.crop.rectangle, person.text.rectangle
Cameracamera, camera.fill
Scandoc.viewfinder, qrcode.viewfinder
Settingsgearshape, slider.horizontal.3

Step 3: Preview (Optional)

# Iconify preview
$SKILL_DIR/scripts/iconify_gen.sh preview mdi:receipt-text-outline

Step 4: Generate

Iconify API:

# 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:

# 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:
    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

PrefixNameCountStyle
mdiMaterial Design Icons7400+Filled + outline variants
phPhosphor9000+6 weights per icon
solarSolar7400+Bold, linear, outline
tablerTabler Icons6000+Consistent stroke width
lucideLucide1700+Clean, minimal
riRemix Icon3100+Filled + line variants
carbonCarbon2400+IBM design language
heroiconsHeroIcons1200+Tailwind CSS companion

Browse all: https://icon-sets.iconify.design/

Scripts Reference

ScriptSourcePath
iconify_gen.shIconify API (275k+ icons)$SKILL_DIR/scripts/iconify_gen.sh
generate_icons.swiftSF Symbols (5k+ icons)$SKILL_DIR/scripts/generate_icons.swift

Best Practices

  • Search before generating -- browse available icons to find the best match
  • Match existing project style -- check dimensions, color, and weight of existing icons before generating new ones
  • Use Iconify for variety -- 200+ collections means you can find the exact style you need
  • Use SF Symbols for Apple consistency -- they match system UI perfectly
  • Generate directly to asset catalog -- use --output ./Assets.xcassets/icons to skip manual copying
  • Verify visually -- always preview the @2x PNG before committing

Anti-Patterns

  • Generating icons without checking existing project icon style
  • Using default colors when the project has a defined color palette
  • Generating at wrong sizes (check existing icons first)
  • Committing generated icons without visual verification

Add the canonical catalog link to the repository README so users can inspect current installs and available audits. The publishing guide covers the complete discovery path.

<a href="https://skillzs.dev/skills/affaan-m/everything-claude-code/ios-icon-gen">View ios-icon-gen on skillZs</a>