画像 / アプリアイコン
Icon Composer用Liquid Glassアイコンジェネレーター
前景のPNGまたはSVGを、Icon ComposerとXcode 26で使えるLiquid Glass .iconバンドルに変換します。背景色と余白を選び、ライト、ダーク、色付き、クリアの近似プレビューを比較して、統合済みの1024 × 1024 PNGを書き出せます。
Icon Composer用Liquid Glassアイコンジェネレーター: Icon Composerが自動的に付ける背景グラデーションとは分離した状態で、1つの前景画像を保持します。指定した余白でアートワークを中央に配置し、.iconバンドルをZIPにまとめます。ブラウザ上のプレビューでは、角丸四角形と時計の円形、色付きモードとクリアモードを近似的に表示します。統合済みのPNGには選択した単色のベースカラーが使われ、ガラス素材は含まれません。プレビューの形状と外観のコントロールは、バンドルの設定を変更しません。 サーバーへのファイルアップロードは一切なく、100%ブラウザ内でローカル実行します。
- カテゴリ
- 画像ツール
- 実行回数
- ブラウザ内で
- コスト
- 無料 · 登録不要
- 提供状況
- すぐに使えます
完全にブラウザ内で実行します
Liquid GlassはiOS 26で導入されたAppleのデザイン言語です。アプリアイコンでは、外観や周囲の環境に合わせて変化するレイヤーとマテリアルを使用します。 Appleの開発者向けドキュメント · Human Interface Guidelines
アートワークをここにドロップするか、ファイルを参照してください。透明なアートワークが最適です。最大20 MB。
Icon Composerは選択した色から自動グラデーションを作成して背景を塗りつぶします。これらのプレビューと統合済みのPNGでは単色のベースカラーを使用します。最終的なグラデーションはIcon Composerで調整してください。
これは近似プレビューです。最終的な表示はiOSによってレンダリングされます。形状、色付き、透明の外観はイメージであり、Appleのマテリアルレンダリングではありません。
ZIPを展開し、Xcode 26用のIcon ComposerでAppIcon.iconを開いてマテリアルと外観を確認してから、.iconバンドルをXcodeプロジェクトに追加してください。古いターゲットでは、統合済みのPNGをアセットカタログで使用します。 AppleのIcon Composerガイド
このジェネレーターでは、背景の塗りつぶしの上に前景レイヤーを1つ配置します。レイヤーの奥行き、屈折、ハイライト、シャドウは編集しません。追加のレイヤーはIcon Composerで追加・調整してください。プレビューのコントロールはバンドルの外観設定を変更しません。
画像はブラウザ内に保持されます。何もアップロードされません。
Liquid Glassとアプリアイコンのデザイン
Appleは、デベロッパー向けドキュメントとHuman Interface Guidelinesで、Liquid Glassと適応型アプリアイコンについて説明しています。さまざまなプラットフォームや表示環境で認識しやすいアイコンになるよう、そのガイダンスに従ってください。https://developer.apple.com/documentation/technologyoverviews/liquid-glass および https://developer.apple.com/design/human-interface-guidelines/app-icons
Icon ComposerとXcode
Icon Composerは、レイヤー化されたアートワークとマテリアルの調整に対応しています。抽出した.iconバンドルをXcodeプロジェクトに追加する前に、そこで開いて確認してください。このジェネレーターは、前景レイヤー1枚と、指定した色を基にした自動背景グラデーションを提供します。https://developer.apple.com/icon-composer/ および https://developer.apple.com/documentation/Xcode/creating-your-app-icon-using-icon-composer
使い方
- 前景アートワークには、透明なPNGまたはSVGを選ぶのがおすすめです。余白と背景色を設定します。
- ライトとダークのホーム画面、プラットフォームの形状、色付きまたはクリアにした場合の近似表示を比較します。
- .icon ZIPをダウンロードして展開し、Icon Composerでバンドルを開いて最終的な表示を確認し、Xcodeプロジェクトに追加します。古いターゲット向けに統合済みのPNGをダウンロードすることもできます。
プライバシーと制限事項
画像のデコードと書き出しはブラウザ内で行われます。アートワークがアップロードされることはありません。
関連ツール
よくある質問
Liquid Glassとは何ですか？
Liquid Glassは、iOS 26で導入されたAppleのデザイン言語です。アプリアイコンでは、外観に応じて変化するレイヤーや素材を使用できます。このページでは開始用のバンドルを作成します。最終的な外観はオペレーティングシステムが描画します。
Xcode 26でダウンロードしたファイルを使うにはどうすればよいですか？
ZIPを展開し、Icon ComposerでAppIcon.iconバンドルを開きます。そこでアイコンを確認して保存し、.iconバンドルをXcodeプロジェクトに追加して、アプリアイコンとして選択します。プロジェクトの設定については、AppleのIcon Composerガイドをご覧ください。
このエディターはレイヤー化された奥行きに対応していますか？
背景の塗りつぶしの上に1つの前景レイヤーを配置します。複数のレイヤー、奥行き、屈折、ハイライト、シャドウの編集には対応していません。レイヤーの追加や素材の調整はIcon Composerで行ってください。
プレビューはiOSでの最終的な表示ですか？
いいえ。角丸四角形や円形の形状、色付きやクリアの効果は近似プレビューです。最終的な表示はiOSが描画します。ブラウザと統合済みのPNGでは単色の背景色が使われ、Icon Composerが自動グラデーションを適用します。
無料ツール · ブラウザ内で · アカウント不要