IcoMoonでWebフォントを作ってみた

2013.08.02

IcoMoonでWebフォントを作ってみた

カテゴリ：おすすめHP

IcoMoon AppでWebフォントを作ってみました。

まずは、インポートするためのSVG形式の画像を作ります。
私は愛用のFireworksで。
Fireworksでは、SVG形式はサポートされていないので、
SVGで書き出すための拡張機能をインストールします。
Aaron Beall - Fireworks Guru - Export

正方形のカンバスに、パスツールで画像を作ったら
【コマンド】→【Export】→【Export SVG】で書き出し。

一文字ずつSVGファイルを用意できたら
IcoMoon Appを開き、【Import Icons】をクリック。
アイコンにしたいSVGファイルを選択してインポート。（複数選択できます）

IcoMoon Select

インポートが完了したら、【Select】ボタンを押してフォントにしたいアイコンを選択。
（もちろん全部でもOKだし、気に入らないのははずしてIcoMoomから提供されているものを選択することもできます）

選択が終わったら【Font→】をクリック。

IcoMoon key

キーボードと対応させる文字を入力し、
必要に応じて【Preferences】や【Font Metrics】を設定します。

【Download】をクリックすると、
ttf、woff、js、cssなどや、
文字コード対応表などのzipファイルがダウンロードされます。

すごく使いやすいし高機能。無料で使えるのはとてもありがたいです。
インポートしたあとで並べ替えができたらもっと使いやすいと思いますがそんな贅沢は申しません。

できあがったフォントファイルは、配布しても大丈夫な模様なので
近々フリー素材POMOで配布したいと思います。

お気に入りの記事を「いいね！」で応援しよう

Last updated 2017.05.05 17:13:19
コメント(0) | コメントを書く

[おすすめHP] カテゴリの最新記事

IcoMoonでWebフォントを作ってみた

いろいろあるのよ

娘たちのいろいろ

娘たちの習い事

縫い物・編み物

洋裁本とか手芸本とか

絵本＆子どもの本

音楽

美味！美味？

懸賞

TB

ブログの素材

おでかけ

日本ハムファイターズ

シルバニアファミリー

ゲーム

お買いもの

おすすめHP

Mac・PC 覚え書き

備忘

カフェオレボウル

大サイズワイン・イタリア

多巣性運動ニューロパチー

生地ショップ LINK

気になる生地たち

音符・音楽・楽器の生地、テープ、モチーフ

DS桃太郎電鉄20周年歴史キャラ&カード一覧