アイコン作成ツールとは？
アイコンメーカーは、アプリ、ウェブサイト、ファビコン用のシンプルでプロフェッショナルなアイコンを作成できます。図形・文字・色をグリッドキャンバス上で組み合わせ、必要なら背景に2色グラデーションを適用し、複数サイズ（16×16〜512×512）でPNG、SVG、マルチサイズ.ico、またはfaviconのZIP一式としてまとめて書き出せます。
ベース形状(円、四角、角丸四角)を選び、背景色と前景色を決めて、中央に文字 1 字か内蔵シンボル(チェック、星、矢印、ハート、プラス)を重ねます。フォントサイズとオフセットを微調整して中央に収め、16×16 のファビコンから 512×512 の PWA マニフェスト用アイコンまで、6 種類の標準サイズをワンクリックで書き出せます。
使い方
- ステップ1 — ベースの図形（円、正方形、角丸正方形）を選び、背景色を設定します。
- ステップ2 — 文字、シンボル、またはシンプルな図形をオーバーレイとして追加し、前景色・サイズ・位置を調整します。
- ステップ3 — 複数サイズでプレビューし、PNG（16, 32, 48, 128, 256, 512px）、SVG、.ico でエクスポートするか、貼り付けるだけのHTMLスニペット付きで favicon ZIP 一式をまとめて取得します。
使用するタイミング
- 個人開発のサイト用にファビコンを用意したいが、Figma を立ち上げたくも、アイコン素材集を買いたくもないとき。
- Android や iOS のプロトタイプ用に、本番アートが上がる前の仮アイコンを作りたいとき。
- 個人サイトや GitHub のアバター用に、頭文字を載せたブランドカラーのタイルを作りたいとき。
結果
開発者がToDoアプリ用のファビコンを作成します。青い角丸正方形の背景（#3B82F6）に白いチェックマークを配置し、ブラウザタブ用に32×32のPNG、PWAマニフェスト用に512×512のPNGとしてエクスポートします。
よくある質問
- サイトのファビコンに本当に必要なサイズは?
- 最低限、デスクトップブラウザのタブ用に 32×32 PNG、iOS のホーム画面と Android のショートカット用に 180×180(または 192×192)。PWA を公開するなら manifest 用に 512×512 も。「すべてのサイズを書き出す」ボタンで一式まとめて生成できます。
- エクスポートは SVG と PNG どちらが良い?
- SVG はどんなサイズでも鮮明に拡大できるので、サイドバーのロゴなどアプリ内で複数サイズに使うアイコンに最適です。PNG はファビコン、アプリストア、ベクター非対応のプラットフォームに必要。エクスポートメニューはどちらにも対応しています。
- 内蔵シンボルではなく自前の画像やシンボルを使えますか?
- 使えます。オーバーレイを「画像」モードに切り替え、PNG・JPG・SVG・WebP をアップロードしてください。選んだ形に合わせて切り抜かれ、書き出し前に拡大縮小・移動・回転ができます。手早く作るなら「文字」モードでも任意の1文字(貼り付けた絵文字を含む)を使えます。完全な独自ロゴなら、透明な SVG を読み込んで背景を透明に設定してください。
- 小さいサイズで書き出すと文字が中心からずれて見えるのはなぜ?
- 活字の視覚的中心は幾何学的中心と一致しないことがほとんどです。下に伸びる文字(g、p、y)や背の高い大文字は、数学的中心から 1〜2 ピクセルずらすと均整が取れます。書き出す前に Offset X と Offset Y のスライダーで調整しましょう。
- 角丸四角は iOS や Android のシステム形状と一致しますか?
- iOS に近い汎用の角丸四角です。Android(丸、Squircle、しずく)も iOS も、送ったアイコンの上に独自の適応マスクをかけるので、フルブリードで設計しておけば、各 OS がそのときの形にトリミングしてくれます。