FontAwesomeを使うと幾らかの制限がありますが、だいぶ種類が豊富なアイコン・ピクトグラムの中からフリーで好きなものを使用することができます。webサービスやブログで手軽に使えるのがポイントです。
webページのheadを編集
https://fontawesome.com/get-startedのページに具体的な方法は記述されています。
上記の設定で＜link＞をコピーして、自身のブログまたはwebサービスの＜head＞に記述します。CDNを使う場合は最新のものが使えるがベータ版であるというのが注意書きされています。上記の方法でない場合はページの下の手動の方を選択してダウンロードします。
使いたいアイコンを使う
次は以下のように自分の気に入ったアイコンを検索して使用するものを決めます。
https://fontawesome.com/icons?d=gallery&q=search
今回はサーチアイコンを使います。
https://fontawesome.com/icons/search?style=solid
以下のように使用します。
これをbodyに貼り付けるとアイコンが表示されるようになります。
ピクトグラム・アイコンの色をカスタムする
ここで表示されるアイコンは、色を変更することが可能です。以下のようにstyleでcolorを指定すればよいです。
赤く表示されるようになります。
<i class=”fas fa-search” style=”color:red”></i>
おわりに
フリーでここまで使えるのは本当に助かる。種類も十分にある。有料版を使わなくてもこれだけ使えれば感謝しかありませんね。
