web-dev-qa-db-ja.com

Font Awesome Iconをファビコンとして使用する

Font Awesome アイコンをファビコンアイコンとして使用できますか?ご存知のように、ブラウザタブのWebサイトタイトルの横に表示される小さなアイコンですか?

96
Connor Black

はい、そうです。目的のキャラクターを含むスクリーンショットを撮り、必要な部分を切り取って画像(.ico)として保存するだけです。

真剣に今、あなたは各ブラウザでサポートされているフォーマットをチェックしたいかもしれません: http://en.wikipedia.org/wiki/Favicon#File_format_support

文字が画像またはベクターファイルの場合、ほとんどのブラウザで問題ありませんが、IE (MSが嫌いだから)。それ以外の場合は、画像として最初に保存する必要があります。

37
Renan

編集: http://gauger.io/fonticon を使用することをお勧めします


それを行うために、私はオンラインのFont Awesome Favicon Generatorを作成しました!

Font Awesome Favicon Generator を参照してください。

256
Paul Ferrett

また、オンラインで Font Awesome Favicon Generator を作成しました。これには、Paul Ferrettのソリューションにはない追加機能があります。

favicon

  • ブラウザーでライブのファビコンのプレビュー
  • アイコンのサイズ設定
  • 透明なアイコンと背景
  • 巨大な画像サイズ(アイコンは必要に応じて詳細にできます)
  • iconsetはgithub pull requestで更新できます
  • 2017年6月6日更新Font Awesome 4.7への更新
  • Update 06/2017ファジー検索とキーワード検索
  • 2017年9月更新積み上げアイコン
  • 2018年6月6日更新Font Awesome 5.0.13への更新
  • 2018年11月更新Font Awesome 5.5.0への更新
  • 2019年4月4日更新Font Awesome 5.8.1への更新
  • 2019年4月更新Font Awesome Pro !のサポートを追加

追加の機能が必要な場合は、問題またはプルリクエスト here を送信してください。

67
eclipse

任意の画像を次のようなファビコンジェネレーターサイトにアップロードできます。

http://favicon-generator.org/

または

http://www.favicon.cc/

選択したサイトのオンライン指示に従ってください。通常は3つのステップからなるプロセスです。サイトの最上位にファビコンを保存します。

ブラウザー間での互換性のために、ファビコンには常に画像を使用することをお勧めします。作成するサイトの一部が最新のブラウザ専用であっても、ファビコンのアートワークを画像に変換します。同じプロセスを一貫して使用することで、心配する必要が1つ減ります。

11
otherDewi

画像に変換せずに、直接素晴らしいフォント文字をファビコンとして使用することはできません。文字を画像に変換する必要があります..

6
Shakeel Ahmed