faviconの作成
写真をサイズ別のPNG・ICOアイコンセットに作成してください。余白・背景・中央を切り取り、マニフェストとインストールタグを一緒に保存してください。
結果
入力後、実行すると結果が表示されます。
サイトに追加するタグ・指示
結果を共有
ツールリンクと結果テキストを一緒に共有します。結果にはURLを入れません。以下の内容を確認して共有してください。
写真・入力値は保存したりアップロードしたりしません。再読み込み・ページ移動前に結果を保存してください。
処理方法と基準
ユーザーの写真を四角いアイコンサイズでレンダリングし、ウェブサイトのインストールファイルセットを作成するツールです。
実際の例
320×240の写真を全体的に保ち、余白を0%で32pxアイコンに変換すると、内容は32×24pxとなり、上下に4pxの余白が生じます。中央を切り取る選択をすると、正方形を埋める際に両側が切り取られます。
よくある質問
ZIPにはどのようなファイルが含まれていますか?
16・32・48・180・192・256・512px の PNG 7種類、16・32・48・256px を含む PNG 圧縮ICO、site.webmanifest、head-tags.txt、README.txtが含まれています。元の写真ファイルは含まれていません。
サイトでどのように適用しますか?
ZIPを解凍してファイルをサイトのルートに配置し、head-tags.txtのタグをHTMLのheadに追加します。サブフォルダーに配置する場合はhrefのパスとマニフェストのWebsite名を変更してください。マニフェストだけでは完全なPWAにはなりません。
透明度・欠落・互換性に制限がありますか?
全維持、中央切り、外側余白0〜30%、透明・白・ユーザー背景色を選択します。Apple用180pxは透明領域を白にします。小さな元画像の拡大は鮮明になる機能ではありません。PNG圧縮ICOは非常に古いWindowsや編集ソフトで開けない場合があります。
計算基準と参考資料
- MDN — バッファコントロール
ウェブサイトアイコンの形式とrel=iconを連携します
- Microsoft — ICO PNG画像
PNG圧縮画像を格納するICO形式と以前の編集ソフトとの互換性