diff --git a/docs/base-css.html b/docs/base-css.html
index cb3bd8b95a7ca71b24a0e728a6f099e2727d407a..01e57e13de0d8b70350ead8e619b7ab6f84e8e0c 100644
--- a/docs/base-css.html
+++ b/docs/base-css.html
@@ -1589,9 +1589,13 @@ For example, <code>section</code> should be wrapped as inline.
 <pre class="prettyprint linenums">
 &lt;i class="icon-search"&gt;&lt;/i&gt;
 </pre>
-      <p>There are also styles available for inverted (white) icons, made ready with one extra class:</p>
+      <p>There are also styles available for inverted (white) icons, simply add the <code>icon-white</code> class:</p>
 <pre class="prettyprint linenums">
 &lt;i class="icon-search icon-white"&gt;&lt;/i&gt;
+</pre>
+<p>Or, for muted (gray) icons, add the <code>icon-gray</code> class:</p>
+<pre class="prettyprint linenums">
+&lt;i class="icon-search icon-gray"&gt;&lt;/i&gt;
 </pre>
       <p>There are 140 classes to choose from for your icons. Just add an <code>&lt;i&gt;</code> tag with the right classes and you're set. You can find the full list in <strong>sprites.less</strong> or right here in this document.</p>
       <p>
diff --git a/docs/index.html b/docs/index.html
index 60a784160c7734101cdc03882176b3fcdca3da7f..7f46ae4870abcb1d030ca232a6521c8bca1faec8 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -98,10 +98,10 @@
     </ul>
     <ul class="quick-links">
       <li>
-        <iframe class="github-btn" src="http://markdotto.github.com/github-buttons/github-btn.html?user=twitter&repo=bootstrap&type=watch&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="112px" height="20px"></iframe>
+        <iframe class="github-btn" src="http://ghbtns.com/github-btn.html?user=twitter&repo=bootstrap&type=watch&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="112px" height="20px"></iframe>
       </li>
       <li>
-        <iframe class="github-btn" src="http://markdotto.github.com/github-buttons/github-btn.html?user=twitter&repo=bootstrap&type=fork&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="98px" height="20px"></iframe>
+        <iframe class="github-btn" src="http://ghbtns.com/github-btn.html?user=twitter&repo=bootstrap&type=fork&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="98px" height="20px"></iframe>
       </li>
       <li class="follow-btn">
         <a href="https://twitter.com/twbootstrap" class="twitter-follow-button" data-link-color="#0069D6" data-show-count="true">Follow @twbootstrap</a>
diff --git a/img/glyphicons-halflings-gray.png b/img/glyphicons-halflings-gray.png
new file mode 100644
index 0000000000000000000000000000000000000000..08b7ac038f7fc53c557c569a6bd043b5a0367e7b
Binary files /dev/null and b/img/glyphicons-halflings-gray.png differ
diff --git a/less/sprites.less b/less/sprites.less
index 72a3a916b65fbef81cfc56a98bf5cd62a2d1defc..d3f330af898a00c281ed8a53fc54a4e559a80ca3 100644
--- a/less/sprites.less
+++ b/less/sprites.less
@@ -30,6 +30,9 @@
 .icon-white {
   background-image: url("@{iconWhiteSpritePath}");
 }
+.icon-gray {
+  background-image: url("@{iconGraySpritePath}");
+}
 
 .icon-glass              { background-position: 0      0; }
 .icon-music              { background-position: -24px  0; }
diff --git a/less/variables.less b/less/variables.less
index b931d3d2a26ae072283808d0ece8520717f732f9..56496edaa77359bae634e45405d5ff53a5aa030a 100644
--- a/less/variables.less
+++ b/less/variables.less
@@ -131,6 +131,7 @@
 // -------------------------
 @iconSpritePath:          "../img/glyphicons-halflings.png";
 @iconWhiteSpritePath:     "../img/glyphicons-halflings-white.png";
+@iconGraySpritePath:      "../img/glyphicons-halflings-gray.png";
 
 
 // Input placeholder text color