iOS Icon Generator
FreeEffortlessly generate PNG icons for Xcode projects.
Free · Opens the source repo
What iOS Icon Generator does
The iOS Icon Generator is a command-line tool designed to create PNG image sets for iOS application icons directly compatible with Xcode asset catalogs. It utilizes two primary sources: SF Symbols, which offers over 5,000 Apple-native icons, and the Iconify API, providing access to more than 275,000 open-source icons from various collections. This flexibility allows developers to choose the best icon source based on their specific project requirements, whether they need a native Apple style or a broader selection of icons.
To use the generator, developers can search for icons, generate them in multiple resolutions (1x, 2x, 3x), and ensure that the icons align with their existing project styles in terms of size, color, and weight. The tool is particularly useful for replacing placeholder icons with production-quality assets, enhancing the visual consistency of iOS applications. By generating icons that fit seamlessly into the existing design language of an app, developers can maintain a professional appearance throughout their projects.
The iOS Icon Generator is ideal for developers working on iOS or macOS projects who need to create or update icon assets quickly. It simplifies the process of icon management by automating the generation of image sets and ensuring they meet Xcode's requirements. With its straightforward command-line interface, users can efficiently integrate new icons into their projects without the need for manual adjustments or additional graphic design software.
Whether you're a solo developer or part of a larger team, this tool can save time and reduce the complexity associated with icon creation, allowing you to focus more on building your application rather than managing assets.
When to use it
Use this tool when you need to generate or replace icons for iOS/macOS projects, ensuring they fit within your existing design system.
When not to use it
This skill may not be suitable for projects that require highly customized or unique icon designs outside of the provided sources.
What you can build with it
Generating Icons for a New Project
When starting a new iOS project, use the iOS Icon Generator to create a consistent set of icons from SF Symbols or Iconify.
Updating Existing Icons
If your project has placeholder icons, replace them with production-quality assets using this tool to maintain design integrity.
Searching for Specific Icons
Utilize the Iconify API to search for specific icons across various collections, ensuring you find the right fit for your application.
How to install iOS Icon Generator
View source1. Install with the skills CLI
npx skills add affaan-m/ecc/ios-icon-gen --agent claude-code2. Or install it manually
Download the skill folder and drop it into ~/.claude/skills/ for all projects, or .claude/skills/ to scope it to one repo. Restart Claude Code so it picks up the new skill.
Anthropic's agentic coding CLI, and the reference implementation of Agent Skills. Drop a skill folder into ~/.claude/skills and Claude Code loads it automatically whenever a task matches the skill's description. Claude Code docs
Inside SKILL.md
Written by affaan-miOS Icon Generator
2 つのソースから Xcode アセットカタログ用の PNG アイコンイメージセットを生成します。
アクティベートするタイミング
- iOS/macOS Xcode プロジェクト向けアイコンアセットを生成する
- オープンソースコレクション全体でアイコンを検索する
- アセットカタログ用の PNG イメージセット（1x、2x、3x）を作成する
- プレースホルダーアイコンをプロダクション品質のアセットに置き換える
- Xcode プロジェクト内の既存アイコンスタイルに合わせる
コア原則
1. 2 つのソース、1 つの出力フォーマット
どちらのソースも同一の Xcode 互換イメージセットを生成します。必要に応じて選択してください。
| ソース | アイコン数 | 要件 | 最適な用途 |
|---|---|---|---|
| Iconify API | 200 以上のコレクションから 275,000 件以上 | インターネット | 幅広い選択肢、特定スタイル、オープンソースアイコン |
| SF Symbols | Apple シンボル 5,000 件以上 | macOS のみ | Apple ネイティブスタイル、オフライン使用 |
2. 常に既存スタイルに合わせる
生成する前に、サイズ・色・ウェイトの一貫性について、プロジェクトの既存アイコンを確認してください。
3. 出力構造
どちらの方法も完全な Xcode イメージセットを生成します。
<output-dir>/<asset-name>.imageset/
Contents.json
<asset-name>.png # 1x（デフォルト 68px）
<asset-name>@2x.png # 2x（デフォルト 136px）
<asset-name>@3x.png # 3x（デフォルト 204px）
使用例
ステップ 1: 要件の確認
アイコンのニーズを決定します。アイコンが表すもの、好みのスタイル、対象の色とサイズ。
プロジェクトにすでにアイコンがある場合は、既存スタイルを確認します。
# 既存アイコンのサイズを確認
sips -g pixelWidth -g pixelHeight path/to/existing@2x.png
ステップ 2: アイコンの検索
Iconify API（幅広い選択肢に推奨）:
# すべてのコレクションを検索
$SKILL_DIR/scripts/iconify_gen.sh search "receipt"
# 特定のコレクション内で検索
$SKILL_DIR/scripts/iconify_gen.sh search "business card" --prefix mdi
# 利用可能なコレクションを一覧表示
$SKILL_DIR/scripts/iconify_gen.sh collections
SF Symbols（Apple ネイティブスタイル向け）: SF Symbols アプリを参照するか、一般的な名前を確認します。
| ユースケース | シンボル名 |
|---|---|
| ドキュメント | doc.text, doc.fill |
| レシート | doc.text.below.ecg, receipt |
| 人物 | person.crop.rectangle, person.text.rectangle |
| カメラ | camera, camera.fill |
| スキャン | doc.viewfinder, qrcode.viewfinder |
| 設定 | gearshape, slider.horizontal.3 |
ステップ 3: プレビュー（オプション）
# Iconify プレビュー
$SKILL_DIR/scripts/iconify_gen.sh preview mdi:receipt-text-outline
ステップ 4: 生成
Iconify API:
# 基本的な生成
$SKILL_DIR/scripts/iconify_gen.sh mdi:receipt-text-outline editTool_expenseReport
# カスタムカラーと出力場所
$SKILL_DIR/scripts/iconify_gen.sh mdi:receipt-text-outline myIcon --color 007AFF --output ./Assets.xcassets/icons
オプション: --size <pt>（デフォルト: 68）、--color <hex>（デフォルト: 8E8E93）、--output <dir>（デフォルト: /tmp/icons）
SF Symbols:
# 基本的な生成
swift $SKILL_DIR/scripts/generate_icons.swift doc.text.below.ecg editTool_expenseReport
# カスタムカラー、ウェイト、出力
swift $SKILL_DIR/scripts/generate_icons.swift person.crop.rectangle myIcon --color 007AFF --weight regular --output ./Assets.xcassets/icons
オプション: --size <pt>（デフォルト: 68）、--color <hex>（デフォルト: 8E8E93）、--weight <name>（デフォルト: thin）、--output <dir>（デフォルト: /tmp/icons）
ステップ 5: 確認と統合
- 生成された @2x PNG を読み込んで視覚的に確認する
- 直接出力していない場合はアセットカタログにコピーする。
cp -r /tmp/icons/<name>.imageset path/to/Assets.xcassets/<group>/ - プロジェクトをビルドして Xcode が新しいアセットを認識することを確認する
人気の Iconify コレクション
| プレフィックス | 名前 | 件数 | スタイル |
|---|---|---|---|
mdi | Material Design Icons | 7,400 件以上 | 塗りつぶし＋アウトラインバリアント |
ph | Phosphor | 9,000 件以上 | アイコンごとに 6 ウェイト |
solar | Solar | 7,400 件以上 | Bold、Linear、Outline |
tabler | Tabler Icons | 6,000 件以上 | 一定のストローク幅 |
lucide | Lucide | 1,700 件以上 | クリーン、ミニマル |
ri | Remix Icon | 3,100 件以上 | 塗りつぶし＋ラインバリアント |
carbon | Carbon | 2,400 件以上 | IBM デザイン言語 |
heroicons | HeroIcons | 1,200 件以上 | Tailwind CSS のコンパニオン |
すべてを閲覧: https://icon-sets.iconify.design/
スクリプトリファレンス
| スクリプト | ソース | パス |
|---|---|---|
iconify_gen.sh | Iconify API（275,000 件以上のアイコン） | $SKILL_DIR/scripts/iconify_gen.sh |
generate_icons.swift | SF Symbols（5,000 件以上のアイコン） | $SKILL_DIR/scripts/generate_icons.swift |
ベストプラクティス
- 生成前に検索する -- 利用可能なアイコンを閲覧して最適なものを見つける
- 既存プロジェクトスタイルに合わせる -- 新しいアイコンを生成する前に既存アイコンのサイズ・色・ウェイトを確認する
- バラエティには Iconify を使う -- 200 以上のコレクションから必要なスタイルを見つけられる
- Apple の一貫性には SF Symbols を使う -- システム UI と完全に一致する
- アセットカタログに直接生成する -- 手動コピーを省略するため
--output ./Assets.xcassets/iconsを使う - 視覚的に確認する -- コミット前に必ず @2x PNG をプレビューする
アンチパターン
- 既存プロジェクトのアイコンスタイルを確認せずにアイコンを生成する
- プロジェクトに定義されたカラーパレットがあるのにデフォルトカラーを使う
- 間違ったサイズで生成する（まず既存アイコンを確認する）
- 視覚的確認なしに生成されたアイコンをコミットする
Frequently asked questions about iOS Icon Generator
Similar skills
Android App Development
Comprehensive guide for Android and cross-platform app development.
Add App Clip to Expo App
Integrate lightweight iOS App Clips into your Expo project.
APK Reverse
Streamline your Android APK reverse engineering process.
Swift Expert
Master iOS/macOS development with Swift and SwiftUI.
React Native Expert
Build and optimize mobile apps with React Native and Expo.
Kotlin Specialist
Master idiomatic Kotlin with expert patterns and practices.