SVG をアイコンに
SVG から ICO ファビコンと macOS の ICNS アイコンを作成
Web サイト、デスクトップアプリ、ショートカット向けのマルチサイズアイコンを作成します。標準サイズのうち、指定した最大サイズ以下のものを自動でまとめます。Web 開発者とアイコン制作者のためのツールです。
新規ファイルの既定値を編集しています
ICO のサイズは 16、32、48、64、128、256 に固定されています。最大サイズまでのすべてを書き出し、1 つの .ico にまとめます。
含まれるサイズ:16, 32, 48, 64, 128, 256 px
プレビュー
ICO とは
ICO は Windows のアイコンコンテナ形式で、ファビコン、アプリケーションアイコン、デスクトップのショートカットに使われます。1 つの ICO ファイルに複数のラスター画像(通常は 16×16 から 256×256)を収められます。
ICNS とは
ICNS は Apple のアイコンコンテナ形式で、macOS がアプリケーションバンドルや書類タイプのアイコンに使います。1 つの ICNS ファイルに標準サイズ(16、32、64、128、256、512、1024 ピクセル)の PNG 画像を複数収められます。
SVG を ICO や ICNS に変換するのはどんなとき
ブラウザや OS はコンテナ形式のアイコンファイルを使います。Windows のファビコン、デスクトップのショートカット、アプリアイコンが必要なときは、SVG をマルチサイズの .ico に変換してください。標準サイズ(16、32、48、64、128、256)をすべて収め、40〜120 KB が目安です。macOS アプリや Electron、Tauri のバンドルをパッケージするとき、書類タイプのアイコンを差し替えるときは .icns に変換してください。1024 px までの macOS の各サイズを収め、200 KB〜2 MB になります。元の SVG は 1 つ、プラットフォームごとに 1 ファイル、必要なサイズはすべて含まれます。
ICO と ICNS のどちらを選ぶか
どちらも 1 つの SVG から複数サイズのラスター画像をまとめます。ファイルを使うプラットフォームで選んでください。
SVG をマルチサイズの ICO や ICNS にオンラインで変換する方法
- ファイルをドロップするか「ファイルを選択」を押してキューに追加します。一度に最大 40 件です。
- 出力設定(サイズ、DPI、背景、品質、トレースの細かさ)を指定すると、プレビューがその場で更新されます。
- 「すべて保存」を押すと結果をダウンロードできます。キューに複数ある場合は 1 つの ZIP になります。
プライバシー:ファイルはブラウザから出ません
ファイルが端末の外に出ることはありません。変換は JavaScript と WebAssembly を使ってすべてブラウザ内で実行されます。アップロードもサーバー処理もないため、ファイルに関する情報がどこかへ送られることはありません。
何もアップロードされないため、社外秘のロゴ、社内文書、未公開の顧客作品にも安心して使えます。使用中に端末へキャッシュされるので、初回訪問のあとはネットワーク接続がなくても動作します。
よくある質問
ICO と ICNS は何が違いますか?
ICO は Windows のファビコンとショートカットの形式で、ブラウザ、デスクトップ、タスクバーが使います。ICNS は macOS のアイコン形式で、.app バンドル、Finder、Dock が使います。どちらも複数のサイズを 1 つのファイルにまとめ、OS が場面ごとに適したものを選べるようにします。
なぜファイルに複数のサイズが含まれるのですか?
ファビコンはブラウザのタブで 16×16、ブックマークで 32×32、デスクトップでは 48〜256 px で表示されます。macOS では 16×16 のリスト表示から 1024×1024 のスプラッシュ画面まで使われます。標準サイズをすべて含めておけば、OS は常に最も鮮明で適切なサイズを選べ、複数のファイルを管理する必要もありません。
1 つのサイズだけ生成できますか?
最も小さいサイズを最大サイズに指定すれば、そのサイズだけが生成されます。単一解像度のファイルがどうしても必要なら ICO も ICNS も対応していますが、多くのプラットフォームはマルチサイズのまとまりを前提としています。また、たとえば大きなデザインをメニューバーの小さなアイコンまで縮小すると、うまく見えないことがあります。