icomoonで好きなアイコンを追加する手順

アイコンのSVG素材をダウンロード

• Freeのアイコン素材サイトを使う

• 白黒のFlat風アイコンならここ

  • Free vector icons - SVG, PSD, PNG, EPS & Icon Font - Thousands of free icons
    http://www.flaticon.com/

• カラーアイコンならここ

  • 23,600 Free Icons - The Largest Icon Pack Ever |
    Icons8 https://icons8.com/

• SVGの色は黒を選択する

icomoonにインポート

• IcoMoon App - Icon Font, SVG, PDF & PNG Generator
  https://icomoon.io/app/#/select

• 上記でダウンロードしたsvgをアップロードする

• 既存のicomoonのアイコンに追加する場合は、icomoon.svgをインポートしてから追加したいアイコンを新たに選択する

• generate fontsでフォントデータとstyle.cssをダウンロード

• フォントデータとstyle.cssを読み込むことでアイコンとして使うことが出来る様になる

• 色やサイズはCSSで調整する

簡単にフォントを追加できるので今後はよく使っていきたい。