オンライン文字アイコン生成、円形・角丸四角形

文字を小さな正方形アイコンにする

文字アイコンメーカーは、英字・数字・漢字など短い文字を中央に配置した正方形のPNG画像を作るツールです。入力できるのは最大2文字で、文字色、背景色、書体の種類、太字、文字サイズ、図形を調整できます。出力は32、64、128、256、512ピクセルの5サイズです。プレビューは256×256ピクセルで、選んだサイズごとに描き直したPNGをダウンロードします。

図形は正方形、角丸、円形から選べます。背景は単色または斜め方向のグラデーションにでき、透過背景も選択できます。透過を有効にすると背景色とグラデーションは描かれません。文字は選んだ図形の内側に描画されるため、画数の多い漢字や幅のある2文字は、小さい出力で読みにくくならないか確認してください。

ファビコンに使うときのファイル形式

ファビコンは、ブラウザーのタブやブックマークなどに表示されるウェブサイトのアイコンです。このツールには「favicon.ico」という名前のダウンロード項目がありますが、内容は32×32ピクセルのPNG画像です。拡張子が「.ico」でも、ICO形式のファイルが生成されるわけではありません。PNGとして使う場合は、ファイル名を favicon.png などにして、サイト側でPNG画像として指定してください。ICO形式が必要な環境では、PNGをICOへ変換する別の工程が必要です。

MDNはファビコンの一般的なサイズとして16×16ピクセルを挙げ、PNGやICOなどの形式を説明しています。このツールの最小出力は32×32ピクセルです。32ピクセル画像を小さく表示することはできますが、16ピクセルで文字が判読できるとは限りません。サイトに設定した後、実際の表示サイズで線や文字がつぶれないか確かめてください。

文字・色・形を決めてPNGを保存

1. 文字を入力する：1文字または2文字を入力します。入力欄が空の場合は「A」が表示され、3文字以上を貼り付けても先頭の2文字だけがプレビューと画像に使われます。
2. 文字の見た目を整える：ゴシック体、明朝体、等幅フォント、丸ゴシック体から選び、太字のオン・オフと文字サイズ比率を調整します。サイズ比率はキャンバスに対する25〜85%です。大きくするほど目立ちますが、端に近づくため、プレビューで欠けがないか見ます。
3. 色と背景を選ぶ：文字色と背景色を選びます。グラデーションを使う場合は開始色と終了色を指定します。透過背景をオンにすると色付き背景とグラデーションは無効になります。配色パターンを選ぶと、文字色と背景色が切り替わり、単色・不透明の背景に戻ります。
4. 図形を選び、サイズを保存する：正方形、角丸、円形のいずれかを選びます。プレビューを確認し、用途に合う32〜512ピクセルのPNGをダウンロードします。小さく表示する場合は、実際の表示寸法でも確認してください。

ダウンロード前によくある確認

形式と小サイズ表示の確認点

• 出力形式はPNGです。SVGの書き出し機能はありません。拡大するとピクセル画像の輪郭が粗く見えることがあります。
• 「favicon.ico」という項目もPNG画像で、標準的なICOファイルの生成を保証しません。ICOが必要な場合は、形式を変換したファイルの内容を確認してください。
• 文字サイズ比率を上げると、文字が図形の端で切れたり、小さな表示で読みにくくなったりすることがあります。特に漢字や2文字を使う場合は、プレビューと実際の縮小表示の両方を確認してください。
• 文字の太さや字形は端末で利用できるフォントに左右されます。異なる端末で同じ見た目になることや、ブランドロゴの仕上がりを保証するものではありません。