Webフォントのアイコンを自作する!

投稿日:

Webフォントのアイコンが便利すぎて
Font Awesomeをけっこう使ってます
ウェブサイト作る時に、レスポンシブ対応させると
画像でアイコン作るのめんどくさいじゃないですか
各サイズ用意するんめんどくさいし

で、自作できないもんかなーと思っていたら

自作のWEBアイコンフォントの作り方(無料ツールのみでfeedlyフォントを作る)
こちらのブログに詳しく書かれておりましたわ!

icomoonというサービスが
svgのデータをeotとかttfとかにしてくれるんです

イラレマンはささっとsvgをつくります

なんというフリーハンド
そして「名称未設定-3.ai」が普段の仕事の雑さを醸し出しています
⌘Sは何より大事だと何度言ってもこれですわ


上記のブログさんの時からicomoonさんリニューアルされてて
若干わかりにくいかもしれませんが
左上のImport Iconsから作ったsgvをアップロードして
表示されたアイコンを選択して、右下のGenerate Fontでデータ一式をDLです

で、作ったデータがこちら

30px
100px
300px



や~便利すなぁ

なんかこうウェブサイト作ってる時によくある、リストの横っちょのマーカーを
矢印にしたりとか、そういうので
いちいち画像だとダルイ気もするし
Webフォントのアイコンを作ってしまったほうがいいんじゃないかなーとかそんな感じです

画像だとRetina対応とかもクソめんどくさいし
めんどくさいからでかい画像を縮小して使えばいいか!ってのも容量的にダメだし

Webフォントがいいですなぁ

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です