<i class="icon-camera-retro"></i> icon-camera-retro

<p><i class="icon-camera-retro icon-large"></i> icon-camera-retro</p>
<p><i class="icon-camera-retro icon-2x"></i> icon-camera-retro</p>
<p><i class="icon-camera-retro icon-3x"></i> icon-camera-retro</p>
<p><i class="icon-camera-retro icon-4x"></i> icon-camera-retro</p>

<i class="icon-quote-left icon-4x pull-left icon-muted"></i>
Use a few of the new styles together ... lots of new possibilities.

<i class="icon-flag icon-4x pull-left icon-border"></i>
Use a few of the new styles together ... lots of new possibilities.

<a class="btn" href="#">
  <i class="icon-repeat"></i> Reload</a>
<a class="btn btn-success" href="#">
  <i class="icon-shopping-cart icon-large"></i> Checkout</a>
<a class="btn btn-large btn-primary" href="#">
  <i class="icon-comment"></i> Comment</a>
<a class="btn btn-small btn-info" href="#">
  <i class="icon-info-sign"></i> Info</a>
<a class="btn btn-danger" href="#">
  <i class="icon-trash icon-large"></i> Delete</a>
<a class="btn btn-small" href="#">
  <i class="icon-cog"></i> Settings</a>
<a class="btn btn-large btn-danger" href="#">
  <i class="icon-flag icon-2x pull-left"></i> Font Awesome<br>Version 3.2.0</a>
<a class="btn btn-primary" href="#">
  <i class="icon-refresh icon-spin"></i> Synchronizing Content...</a>

<div class="btn-group">
  <a class="btn" href="#"><i class="icon-align-left"></i></a>
  <a class="btn" href="#"><i class="icon-align-center"></i></a>
  <a class="btn" href="#"><i class="icon-align-right"></i></a>
  <a class="btn" href="#"><i class="icon-align-justify"></i></a>
</div>

<div class="btn-group open">
  <a class="btn btn-primary" href="#"><i class="icon-user"></i> User</a>
  <a class="btn btn-primary dropdown-toggle" data-toggle="dropdown" href="#">
    <span class="icon-caret-down"></span></a>
  <ul class="dropdown-menu">
    <li><a href="#"><i class="icon-fixed-width icon-pencil"></i> Edit</a></li>
    <li><a href="#"><i class="icon-fixed-width icon-trash"></i> Delete</a></li>
    <li><a href="#"><i class="icon-fixed-width icon-ban-circle"></i> Ban</a></li>
    <li class="divider"></li>
    <li><a href="#"><i class="i"></i> Make admin</a></li>
  </ul>
</div>

<ul class="icons-ul">
  <li><i class="icon-li icon-ok"></i>Bulleted lists (like this one)</li>
  <li><i class="icon-li icon-ok"></i>Buttons</li>
  <li><i class="icon-li icon-ok"></i>Button groups</li>
  <li><i class="icon-li icon-ok"></i>Navigation</li>
  <li><i class="icon-li icon-ok"></i>Prepended form inputs</li>
  <li><i class="icon-li icon-ok"></i>&hellip;and many more with custom CSS</li>
</ul>

<ul class="nav nav-list">
  <li class="active"><a href="#"><i class="icon-fixed-width icon-home"></i> Home</a></li>
  <li><a href="#"><i class="icon-fixed-width icon-book"></i> Library</a></li>
  <li><a href="#"><i class="icon-fixed-width icon-pencil"></i> Applications</a></li>
  <li><a href="#"><i class="icon-fixed-width icon-cogs"></i> Settings</a></li>
</ul>

<form>
  <div class="input-prepend">
    <span class="add-on"><i class="icon-envelope"></i></span>
    <input class="span2" type="text" placeholder="Email address">
  </div>
  <div class="input-prepend">
    <span class="add-on"><i class="icon-key"></i></span>
    <input class="span2" type="password" placeholder="Password">
  </div>
</form>

<i class="icon-spinner icon-spin icon-large"></i> Spinner icon when loading content...

<i class="icon-shield"></i>&nbsp; normal<br>
<i class="icon-shield icon-rotate-90"></i>&nbsp; icon-rotate-90<br>
<i class="icon-shield icon-rotate-180"></i>&nbsp; icon-rotate-180<br>
<i class="icon-shield icon-rotate-270"></i>&nbsp; icon-rotate-270<br>
<i class="icon-shield icon-flip-horizontal"></i>&nbsp; icon-flip-horizontal<br>
<i class="icon-shield icon-flip-vertical"></i>&nbsp; icon-flip-vertical

<span class="icon-stack">
  <i class="icon-check-empty icon-stack-base"></i>
  <i class="icon-twitter"></i>
</span>
icon-twitter on icon-check-empty<br>
<span class="icon-stack">
  <i class="icon-circle icon-stack-base"></i>
  <i class="icon-flag icon-light"></i>
</span>
icon-flag on icon-circle<br>
<span class="icon-stack">
  <i class="icon-sign-blank icon-stack-base"></i>
  <i class="icon-terminal icon-light"></i>
</span>
icon-terminal on icon-sign-blank<br>
<span class="icon-stack">
  <i class="icon-camera"></i>
  <i class="icon-ban-circle icon-stack-base text-error"></i>
</span>
icon-camera on icon-ban-circle