PixelVault のファビコン作成ツールは、どんな画像でも、何もアップロードすることなく、ウェブサイトとアプリのアイコン一式に変換します。多くの「ファビコン作成」サイトは、アイコンを 1 つ受け取る前に、ロゴを相手のサーバーへ送るよう求めます。ここでは、マルチ解像度の favicon.ico も、PNG アイコンも、マニフェストも、すべてのファイルがブラウザ内で作られるため、ブランドのアートワークがデバイスの外に出ることはありません。
現代のサイトに必要なアイコンは 1 つではありません。ブラウザはアドレスバーとタブのために小さな favicon.ico を読み、iOS はホーム画面用に 180×180 の apple-touch-icon を求め、Android と PWA は web マニフェストから参照される 192・512px の PNG を使います。PixelVault は 1 枚の元画像からこれらすべてを一度に作成し、そのまま貼り付けられる HTML スニペットも渡してくれるので、組み込みは数秒で終わります。
アイコンの見た目は自由に決められます。素の正方形のままにしても、角を丸めても、円形に切り抜いても構いません。ワードマークが端にくっつかないように余白を加えたり、透過または単色の背景を選んだりもできます。ライブプレビューでは、模擬のブラウザタブを含め、実際のファビコンサイズでの見え方が分かるので、ダウンロード前に訪問者の目に映るものを正確に把握できます。
仕組み
画像を追加すると、ブラウザがそれをメモリ上にデコードし、PixelVault が各アイコンサイズの正方形 canvas に描き直して、選ばれた形状マスク・余白・背景を適用します。各 canvas はブラウザ内蔵のエンコーダーで PNG にエンコードされ、16・32・48px の PNG が 1 つの favicon.ico(広くサポートされている PNG-in-ICO コンテナー)にまとめられます。SVG のロゴは、まず高解像度でローカルにラスタライズされるため、アイコンは鮮明なまま保たれます。
ローカル処理が重要な理由
アイコンをローカルで生成するということは、多くの場合まだ公開されていないブランド素材であるロゴが、第三者のサービスに送信・保存・記録されることが一切ないということです。しかも瞬時です。アップロードも待ち行列もダウンロードの往復もなく、ページさえ読み込まれていればオフラインでも動作し続けます。ダウンロードされるのは、ブラウザが生成したそのものであり、余計なものは何も加わりません。
対応フォーマット
- ICO — タブとアドレスバー用の、マルチ解像度の favicon.ico(16/32/48px)。
- PNG — apple-touch-icon(180px)と Android/PWA アイコン(192・512px)。
- SVG — 入力のみ。ベクターのロゴはローカルでラスタライズされ、最も鮮明なアイコンになります。
- JPG / WebP — PNG と並んで、元画像として利用できます。
主な使用例
- 新しいウェブサイトやランディングページ用に favicon.ico とアプリアイコンを作成できます。
- PNG や SVG のロゴを、正しいマルチサイズの ICO ファイルに変換できます。
- PWA 用に apple-touch-icon と web マニフェストのアイコンを生成できます。
- ロゴをオンラインサービスに渡すことなく、ブランドのファビコン一式を刷新できます。