Now liveThe Skillselion MCP - thousands of ranked skills, loaded into your agent mid-task. No install.Get it →
affaan-m avatar

Ios Icon Gen

  • 1.4k installs
  • 238k repo stars
  • Updated August 5, 2026
  • affaan-m/ecc

This is a copy of ios-icon-gen by affaan-m - installs and ranking accrue to the original listing.

ios-icon-gen is a Claude Code skill that instantly generates production-ready PNG imagesets for Xcode asset catalogs from SF Symbols or Iconify for developers who need iOS or macOS icon assets without manual export work.

About

ios-icon-gen is an ECC community skill that builds PNG icon imagesets for Xcode asset catalogs from two sources: Apple SF Symbols (5000+ native symbols) and the Iconify API (275k+ open-source icons across 200+ collections). It searches collections, selects symbols, and outputs 1x, 2x, and 3x PNG imagesets ready for Assets.xcassets. iOS and macOS developers reach for ios-icon-gen when replacing placeholder tab bar or toolbar icons, prototyping UI chrome, or standardizing icon assets without hand-exporting every density from design tools.

  • Generates complete Xcode .imageset folders with Contents.json and 1x/2x/3x PNG variants
  • Two sources: 5,000+ Apple SF Symbols (offline, macOS-native) or 275,000+ icons from 200+ Iconify collections
  • Always matches existing project icon style for size, color, and weight consistency
  • Replaces placeholder icons with production-quality assets in seconds
  • Outputs directly compatible with Xcode asset catalogs for iOS and macOS

Ios Icon Gen by the numbers

  • 1,375 all-time installs (skills.sh)
  • +84 installs in the week ending Aug 5, 2026 (Skillselion tracking)
  • Data as of Aug 5, 2026 (Skillselion catalog sync)
npx skills add https://github.com/affaan-m/ecc --skill ios-icon-gen

Add your badge

Show developers this skill is listed on Skillselion. Paste this into your README.

Listed on Skillselion
Installs1.4k
repo stars238k
Last updatedAugust 5, 2026
Repositoryaffaan-m/ecc

How do you generate Xcode imagesets from SF Symbols?

Instantly generate production-ready PNG imagesets for Xcode asset catalogs from either SF Symbols or 275k+ Iconify icons.

Who is it for?

iOS and macOS developers who need fast, production-ready tab bar, toolbar, or list icons inside Xcode asset catalogs.

Skip if: Teams building Android-only or web-only UIs without Xcode asset catalogs should skip ios-icon-gen.

When should I use this skill?

An iOS or macOS project needs new icons, asset-catalog imagesets, or searches across SF Symbols and Iconify collections.

What you get

PNG imagesets at 1x, 2x, and 3x scales added to Xcode asset catalogs

  • PNG imagesets at 1x/2x/3x
  • Updated Assets.xcassets entries

By the numbers

  • Supports 5000+ Apple SF Symbols
  • Accesses 275k+ Iconify icons from 200+ collections
  • Exports 1x, 2x, and 3x PNG imagesets

Files

SKILL.mdMarkdownGitHub ↗

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

Related skills

How it compares

Pick ios-icon-gen over manual Sketch or Figma exports when you need searchable SF Symbol or Iconify sourcing straight into Xcode imagesets.

FAQ

What icon sources does ios-icon-gen support?

ios-icon-gen generates PNG imagesets from Apple SF Symbols (5000+ native symbols) or the Iconify API with 275k+ open-source icons from 200+ collections.

What scale factors does ios-icon-gen export?

ios-icon-gen produces PNG imagesets at 1x, 2x, and 3x resolutions formatted for direct insertion into Xcode asset catalogs.

When should ios-icon-gen be used in iOS projects?

ios-icon-gen applies when generating icon assets, searching open-source collections, creating imagesets, or replacing placeholder icons in iOS or macOS Xcode projects.

This week in AI coding

Five minutes, every Monday - the tools, releases and tactics for developers.

unsubscribe anytime.