先日、WordpressテーマでAMPロゴマークのアイコンフォントを使いたくなりました。
それで、何処かにSVGファイルの無償ダウンロードページがないかと探してみたのですが、見つからなかったので自作してみました。
目次
使用したAMPロゴマーク
とは言っても、AMPプロジェクトのサイトに「ロゴマーク＆ロゴ」の以下のようなSVGファイルはありました。
ですので、「上記のSVGファイルのロゴマーク部分」だけを利用する形で、「AMPロゴマークのSVGファイル」を作成してみました。
で、作成したものが以下。右クリックからダウンロードできます。
SVGファイルを編集するのに、無料ツールのInkscapeを利用しました。
その他に、画像などからロゴマークSVGを作成したい場合は、以下の方法で結構手軽に作れるかと思います。
あと一応、今後何かに使えるかもしれないので、大きなPNGも作っておきました。
アイコンフォントを作成する
SVGからアイコンフォントを作成するには、IcoMoonというWEBサービスを利用するのが最も手っ取り早いかと思います。
アイコンフォントを作成するには、IcoMoon上にある「Import Icons」ボタンをクリックすると「ファイル選択ダイアログ」が表示されるので、SVGファイルを選択します。
SVGファイルを選択すると、操作パネル上に「作成したSVGロゴマーク」が表示されると思うので、それを確認したら「Generate Font」をクリックしてください。
あとは、アイコンフォントの呼び出し名を設定したら「Download」ボタンを押せば、作成されたアイコンフォントがダウンロードできます。
HTMLなどで、アイコンフォントを使用する方法については、以下に詳しく書いてあるので、使い方がわからない場合は参照してみてください。
まとめ
今回作成した、SVGファイルは、ベクター画像などに、あまり詳しくない素人が編集したものですので、そこら辺はご了承ください。
正直、あまり使いどころはないと思いますが、とりあえず僕の目的は達成されました。
とはいえ、そのうちFont Awesomeとかで作られるのではないかと思います。
