Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How can I make Bootstrap icons work on dark background?

I'm using the Bootswatch Cyborg theme of Twitter's Bootstrap library. However, the Cyborg theme has a dark background and light foreground colors, a negative look from the Bootstrap defaults. The icon set PNG assumes a light background, and doesn't show in the Cyborg theme. Is there a corresponding icon set for dark backgrounds? I couldn't find one on Glyphicons' site. Is there an easy trick to turn the icons into the negative color?

like image 707
Wolfram Arnold Avatar asked Apr 22 '12 16:04

Wolfram Arnold


1 Answers

Add icon-white class to your bootstrap icon and it will be white on dark.

like:

<i class="icon-search icon-white"></i>

This works for Bootstrap 2 as seen in http://twitter.github.com/bootstrap/base-css.html

like image 185
guax Avatar answered Sep 28 '22 14:09

guax