Web開発など

Java, JS, CSS, HTML, Unity, C# のことなどを書いてます。フリーソフトや二次創作の公開もしています。

CSSだけのアイコンフォント

Web画面のアイコンフォントといえば Font Awesome などが有名だと思います。ただ、1個か2個のアイコンだけ使うときに、もっとサイズが軽いものはないかと調べたことがありました。

今回はそのときに見つけた、CSS だけのアイコンフォントを2つメモっておこうと思います。

1. CSS ICON

公式ページ

f:id:mamorums:20180226120932p:plain

公式ページでアイコンをクリックすると、右側に HTML と CSS が表示されます。それをそのままコピペすれば、自分が作っているページに取り込めるようです。アイコンの検索もできるので便利です。

2. ICONO

公式ページ

f:id:mamorums:20180226120944p:plain

こちらはスタイルシートを読み込む感じです。公式ページを見る限りだと、CSS ICON よりフォントの種類が少ない気がします。

感想

良い点は、やはりサイズが軽いことですかね。特に CSS ICON は、1文字(1フォント)単位で組み込めるのですごい軽さです。

難点はサイズ変更でしょうか。フォントじゃないので、CSS の font-size が使えないような気がします。

他には、

  • 色の設定も複雑かも(color も使えないような)
  • アイコンの種類が少ない

といったところが難点になるのかもしれません。