Matching color of "icon-home" in twitter bootstrap

Question

I'm trying to match the color of the home icon using twitter bootstrap to the color of the inactive text like so:

<div class="navbar navbar-fixed-top">
  <div class="navbar-inner">
    <div class="container">
      <ul class="nav">
        <li class="nav_item"><a href="indexdefaults.html"><i class="icon-home icon-gray"></i>Home</a></li>
        <li class="active"><a href="about.html">About</a></li>
      </ul>
    </div>
  </div>
</div>

but the "icon-gray" class is much darker than the text in the "nav_item" class. What is the appropriate class icon-foobar that matches the color of the nav_item text?

Answer 1

You can get the gray color by using a custom style:

.icon-gray {
  opacity: 0.3;
}

You might have to change the opacity lower or higher as per the weight of black.

Answer 2

There are only two variations to the icons, white and dark, if you want to get a different colored set of icons you have to modify the original icons in photoshop or pay for the full icon set and modify the source files. There is no .icon-gray.