ファビコン（favicon）とは「favourite icon（＝お気に入りのアイコン）」の略称で、ブラウザでウェブサイトを開いたときの目印となるイメージです。
一般的なファビコンのサイズは「16px × 16px」や「32px × 32px」で、フォトショップやイラストレーター、ファビコン作成サイトなどで作るのが主流です。
しかし、まったくの初心者がフォトショップなどで一からファビコンを作ると時間がかかります。個人ブログの運営者などの場合「それなりにオシャレなファビコンができれば満足」という方も多いのではないでしょうか。
そこで本記事では、オシャレなファビコンが簡単に、無料で、すぐ作れるサイト「favicon.io」と、その使い方をご紹介します。
「Favicon.io」とは？
本記事でご紹介する「Favicon.io」とは、文字や画像、絵文字からファビコンを生成できる無料サービスです。
Favicon.ioではファビコンの生成サービスの他、ロゴを簡単に作成できるツールや、.png, .jpg, .gifなどの拡張子のファイルをファビコン用の「.ico」形式に変換できるツールも無料で公開しています。
Favicon.ioが公開しているファビコンの生成ツールには、以下の3種類があります。
- Generate from Text（文字からファビコンを生成）
- Generate from Image（画像からファビコンを生成）
- Generate from Emoji（絵文字のファビコンを生成）
「①Generate from Text」は、背景色や文字色、枠のカーブやフォントタイプを選択してファビコンを作れるツールです。
「②Generate from Image」は既存の画像をファビコン用のサイズや拡張子に変換できるツールで、「③Generate from Emoji」ではすでに作成されている絵文字を使ったファビコンをダウンロードできます。
特に「①Generate from Text」では、フォントのデザインや背景色などを組み合わせて、オリジナル性の高いファビコンを簡単に作ることができます。
次の項目では、Favicon.ioを使ってファビコンを作る手順をご紹介します。
「Favicon.io」でファビコンを作る
Favicon.ioを使って、文字入りのファビコンを作る方法をご紹介します。
基本操作
まず、The best Favicon Generator (completely free)にアクセスします。
アクセスすると上記のような画面が開きます。それぞれの項目の使い方は以下の通りです。
- Text：ファビコンに入れる文字を入力します。
- Backgroud：「Square（四角形）」、「Circle（円形）」、「Rounded（円枠）」のいずれかから選べます。
- Font Family：フォントのデザインを選択できます。
- Font Size：フォントサイズを選択できます。
- Font Color：フォントの色を選択できます。
- Background Color：バックグラウンドの色を選択できます。
画面の中でデザインを設定すると、作成したファビコンがタブ上に常時反映されます。
色やフォントのバランスを見ながらデザインを設定をし、デザインが完成したら [Download] をクリックしましょう。
「16px × 16px」や「32px × 32px」の.png形式や、.ico形式など、様々なフォーマットのファビコンを圧縮したファイルがダウンロードされます。
▲展開後のファイル
Favicon.ioで簡単にお洒落なアイコンを作ろう
「Favicon.io」は、初心者でも簡単にファビコンを作成できるサイトです。
本サイトには余計な操作箇所がなくシンプルで使いやすい上、利用できるフォントもお洒落なものばかりなので、フォトショップやイラストレーターを使わずに素敵なファビコンを作ることができます。
慣れてくると1分程度で作業が終わるので、個人ブログやアフィリエイトサイトを開設したてでなかなかデザインまで手が回らない方などにオススメです。
ぜひ活用してみてください。
＜参考＞
favicon.io：The ultimate favicon generator
