rcmdnk's blog

Font Awesome がアップデートされて20個程の新しいアイコンが新たに導入されました。

Sponsored Links

Font Awesome

Font Awesomeは色々なアイコンをWebフォントとして使えるフォント集。

<head>内等に

<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css" rel="stylesheet">

とFont AwesomeのCSSを読み込んであげて 1、 後は 適当に使いたい所で

<i class="fa fa-fort-awesome"></i>

の様にi要素を使ってクラスにfaと使いたいフォント名を入れてあげれば こんな風に表示されます。

フォントなので文字として色々そのまま修飾することも出来ますし、 fa-5x等の修飾クラスを使って大きくしたり色をつけたりすることも出来ます2

GitHub ()等のWebサービスのアイコンや Firefox ()などアプリのアイコン等も色々あります 3

4.5.0で追加されたアイコン

今回追加されたのはこちら

  • : <i class="fa fa-bluetooth"></i>
  • : <i class="fa fa-bluetooth-b"></i>
  • : <i class="fa fa-codiepie"></i>
  • : <i class="fa fa-credit-card-alt"></i>
  • : <i class="fa fa-edge"></i>
  • : <i class="fa fa-fort-awesome"></i>
  • : <i class="fa fa-hashtag"></i>
  • : <i class="fa fa-mixcloud"></i>
  • : <i class="fa fa-modx"></i>
  • : <i class="fa fa-pause-circle"></i>
  • : <i class="fa fa-pause-circle-o"></i>
  • : <i class="fa fa-product-hunt"></i>
  • : <i class="fa fa-reddit-alien"></i>
  • : <i class="fa fa-scribd"></i>
  • : <i class="fa fa-shopping-bag"></i>
  • : <i class="fa fa-shopping-basket"></i>
  • : <i class="fa fa-stop-circle"></i>
  • : <i class="fa fa-stop-circle-o"></i>
  • : <i class="fa fa-usb"></i>

What’s New

BluetoothやUSBなんかは使えそうですね。

Feedlyアイコン

随分前からリクエストが出ていて今回入ったかな、と思ったのですが まだ入ってないようです。

Icon request: icon-feedly · Issue #2086 · FortAwesome/Font-Awesome

Feedly側がライセンス的な問題で拒否してたりするのかな、 と思ってたら、どうも単に中の人が入れたがってないだけな感じ。

RSSのアイコンがあるから必要ないじゃん?という立場を何故か崩そうとしない。。。

仕方ないので上のGitHubなどとの並びのアイコンの中でも Feedlyだけは普通に画像を使ってます。(他のメールとかTwitterはフォントです。)

Sponsored Links
Sponsored Links

« MenuBarGmailに既読機能、メール送信機能を付けた Pythonでcallbackに引数を使う方法と注意点 »