数多くの無料アイコンから必要なものだけをセットにして、軽量化されたWebフォントやSVGを作成できるサービスのまとめ
Post on:2014年8月28日
セットになったアイコンはデザインが統一されており、それはそれで便利ですが、全部のアイコンを使うことはほとんどないと思います。
自分が必要なアイコンだけをセットにし、軽量化されたセットにして、WebフォントやSVGとして利用できるオンラインサービスを紹介します。
用意されたアイコンからセットを作ってもよし、自分のアイコンを加えてセットにすることもできます。

flat icon
フォーマット:font(woff, eot, ttf, svg), png, svg, eps, psd
462種類のパック、55,000個のアイコンから使用するアイコンだけを選択し、セットにすることができます。チェックしたアイコンはクッキーで保存されているので、ログインしないでも利用できます。

Fontello
フォーマット:font(woff, eot, ttf, svg)
SILやMITなどオープンソースのさまざまなアイコンから、自分用のセットを作成しダウンロードすることができます。名前やコードをカスタマイズすることも可能です。

IcoMoon
フォーマット:font(woff, eot, ttf, svg), png, svg
450種類のアイコンだけでなく、自分のアイコンを加えて、セットにすることができます。用意されているセットではAIファイルもダウンロードできます。

Iconvau.lt
フォーマット:font(woff, eot, ttf, svg)
zipでまとめたアイコンからアイコンフォントを作成します。掲載されているアイコンを加えることもできます。

iconmelon
フォーマット:svg
最近はアイコンをSVGで利用することも増えてきました。iconmelonはかわいらしいアイコンが数多く揃っており、それらを組み合わせたSVGのスプライトファイルをダウンロードできます。

Fontastic
フォーマット:svg
9,000種類のアイコンから組み合わせてセットをつくり、SVGのスプライトファイルをダウンロードできます。

TTFやOTFのフォントファイルの中身がチェックでき、カスタマイズできるサービスです。グリフを必要なものだけにして、軽量化することができます。

使用するアイコンセットを選択すると、それらをCDNで利用できるコードが生成されます。

見た目のクオリティはそのままで、SVGファイルを大幅に軽量化する便利ツール -SVGO GUI
SVGファイルを使う時に気をつけたいのが、そのファイルサイズ。SVGO GUIは見た目には影響を与えないメタデータ、コメント、冗長なコード、不要なエレメントや値を取り除きます。
sponsors