Cntlog

無料で使えるCSSで簡単に使える便利なアイコンフォント集

開発全般

投稿日

アイコンフォントといえば、fontawesome一択みたいな運域はありますが、最近は別のものでも結構便利なアイコンフォントが合ったりします。

個人的にはfontawesome好きなんですが、矢印(chevron-right)とかが自分のデザインに合わなくてもやもやもやもやしていました。

いくつか気に入ってる、簡単に使えるアイコンフォントをご紹介します。

Line Icons

完全無料で使えるおしゃれなアイコン集。
個人的には一番お気に入りです。

公式サイト

使い方

CDNで読み込む

下記のCSSを読み込む

<link href="https://cdn.lineicons.com/1.0.1/LineIcons.min.css" rel="stylesheet">

HTMLのサンプル

cheetsheetにあるアイコンを選択してclassをつける

<i class="lni-add-file"></i>
<i class="lni-cart"></i>
<i class="lni-calculator"></i>

Linearicons

無料版とプロ版とあります。
無料版でも170個のアイコンがあるので結構使えます。

公式サイト

使い方

CDNで読み込む

下記のCSSを読み込む

<link rel="stylesheet" href="https://cdn.linearicons.com/free/1.0.0/icon-font.min.css">

HTMLのサンプル

cheetsheetにあるアイコンを選択してclassをつける

<span class="lnr lnr-mustache"></span>