ImageMagickでfaviconを作成する
MacでHomebrewをImageMagickを導入し、faviconを作成する方法について記載します。
ウェブサイトを作成するときに必須となる作業ですが、faviconの変換方法をよく忘れてしまうので、備忘録的に記載します。
目次
Homebrewを導入する
Homebrew は macOS 用パッケージマネージャーです。
macOS 用パッケージマネージャー — Homebrew
MacOSであれば下記コマンドで導入できます。
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"ImageMagickをインストールする
先程導入したHomebrewを使ってimagemagickを導入します。
インストールコマンド
brew install imagemagickインストールには結構時間がかかります。5分程度かかりますので気長に待ちます。
画像を favicon に変換する
favicon用のicoファイルを作成します。
favicon は .ico ファイルとなります。
今回はpngの画像をicoに変換します。
image.pngという元画像をfavicon.icoに変換するコマンドです。
icoファイルはマルチアイコンと言って1つのファイルに複数のサイズの画像を含めることができます。
下記コマンドで16,24,32,40,48,64,96,128,192,256のサイズを含んだマルチアイコンを作成できます。
image.png から favicon.ico を作るコマンドの例です。
magick convert image.png -define icon:auto-resize favicon.icoしかし、上記コマンドでは、マルチアイコンとして含める画像が多くなり、容量が大きくなりすぎてしまうので私はいくつかのサイズに限定しています。
私の場合は16,32,48,64のサイズでfaviconは作ることにしています。
下記コマンドでマルチアイコンに含める画像サイズを指定して生成できます。
magick convert image.png -define icon:auto-resize=16,32,48,64 favicon.ico追記
2019-04-26 追記
最近 favicon を作る作業が多く、毎回コマンドを打つのは大変なので favicon の生成・変換ツールを作りました。
ファイルをアップロードしてサイズを選択するだけで自動生成してくれるため便利です。
