カテゴリー ‘ デザイン

Twitter Bootstrapのアイコンの色をカラフルにする方法


こんにちは、@9ensanです。

twitterbootstrap-icon-color-font-01

Webサイトを作る際、「TwitterBootstrap」を利用している方も多いかと思います。
そのTwitter Bootstrapの中で、利用することが可能な「Icons」これが画像ファイルで作成されている為に色を変更する事が容易ではありません。

以前、Twitter BootstrapのIssueでも「Twitter Bootstrapの3.0からiconはfontになるよ」と書かれていたので3.0からは色を自由にスタイルシートで変更できるようになるみたいです。

ですが、今すぐに変更したい場合困ります。ということで、今のIcon画像をWebFontに変更する手順を紹介します。
今回使用するWebFontは「FontAwesome」です。
Twitter Bootstrapに利用されているIconのFontは全部揃っています。

それでは手順です。

続きを読む

return top