favicon / アイコン生成 — 16〜512px を一括出力

使い方

正方形の高解像度画像 (512×512 以上を推奨) をドロップまたはファイル選択でアップロードします。生成したいサイズにチェックを入れて「アイコンセットを生成」を押すと、各サイズの PNG とマルチサイズ favicon.ico がプレビューに並びます。「ZIP でまとめてダウンロード」で一括取得、もしくは各カードから個別ダウンロード可能。Canvas でリサイズ、ICO バイナリも自前で構築しているのでサーバー通信は一切ありません。

よくある質問

画像はサーバーにアップロードされますか?

いいえ。ファイル選択 / ドロップ時点で Image オブジェクトと Canvas で読み込まれ、リサイズも ICO 生成もすべてブラウザ内の JavaScript で行います。ネットワーク通信は一切発生しません。

favicon.ico の中身は何ですか?

16×16 / 32×32 / 48×48 の 3 つの PNG を Windows ICO 形式で 1 ファイルにまとめたものです。ブラウザはサイズに応じて適切な PNG を選んで表示します (タブは 16/32、お気に入りは 32/48 など)。HTML には `<link rel="icon" href="/favicon.ico">` で参照します。

180px / 192px / 512px は何に使う?

180px は Apple Touch Icon (iOS のホーム画面)、192px は PWA や Android Chrome、512px は PWA のスプラッシュスクリーンや大画面用です。Web App Manifest の `icons` に 192 と 512 を登録するのが PWA の標準。

SVG を入力にできますか?

はい。ブラウザがネイティブにレンダリングできる SVG なら入力として使えます。SVG をそのまま favicon としても使いたい場合は、別途 `<link rel="icon" type="image/svg+xml" href="/icon.svg">` を設定してください (本ツールは PNG / ICO のみ出力)。

元画像が長方形だとどうなりますか?

そのまま正方形にリサイズされるので縦横比が変わって歪みます。事前に「画像トリミング」ツールで正方形にしてから入れてください。

古い IE 用に BMP 形式の ICO が必要では?

現代のブラウザはすべて ICO 内の PNG を解釈できます。Windows XP の IE6 など 2010 年以前のクライアントが対象でない限り PNG ベースの ICO で十分です。本ツールも PNG ベースで出力します。

類似のツール

画像リサイズ — px / % で縦横比維持・ロック

JPEG / PNG / WebP の最長辺を指定して、アスペクト比を保ったまま縮小します。複数ファイルをまとめて処理して、個別保存 / ZIP 一括ダウンロードに対応。すべてブラウザ内で処理。

画像リサイズ

画像形式変換 — JPG / PNG / WebP 相互

画像を JPEG / PNG / WebP の間で変換します。ブラウザの Canvas で再エンコードするのでネット通信なし。JPEG/WebP は品質スライダー対応。複数ファイル一括処理 + ZIP ダウンロード対応。

画像変換

AVIF を JPG / PNG / WebP に変換 — 古い Safari でも開ける形式へ

ブラウザネイティブの AVIF デコーダで .avif 画像を読み込み、JPEG / PNG / WebP として書き出します。AVIF はファイルサイズが小さく Web 配信向きですが、古い Safari やビューアでは開けないことが多く、メール添付や Office / Slack などへの貼り付けにも不向きです。複数ファイルを一括変換して ZIP でまとめてダウンロードもできます。アップロードした画像は外部に送信されず、すべての処理はブラウザ内で完結します。

画像変換

色覚シミュレーション — 色覚多様性の見え方

画像が 1 型 (P 型・赤)・2 型 (D 型・緑)・3 型 (T 型・青) 色覚や 1 色覚 (全色盲) でどう見えるかをシミュレートします。デザインや資料の色使いがアクセシブルか確認するのに。Canvas + 色覚変換行列でブラウザ内処理、画像はアップロードされません。

画像色