<div class="stacked-icons">
  <span class="fa-stack fa-3x">
    <i class="fa fa-calendar-o fa-stack-2x"></i>
    <strong class="fa-stack-1x calendar-text">27</strong>
  </span>

  <span class="fa-stack fa-3x">
    <i class="fa fa-comment fa-stack-2x"></i>
    <strong class="fa-stack-1x fa-stack-text fa-inverse">5</strong>
  </span>

  <span class="fa-stack fa-3x">
    <i class="fa fa-file-o fa-stack-2x"></i>
    <strong class="fa-stack-1x fa-stack-text file-text">16</strong>
  </span>
</div>
.calendar-text { margin-top: .3em; }
.file-text { margin-top: .2em; }






/* other styles for demo */
.fa-stack { font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif; }
.stacked-icons {
  margin-top: 20px;
  text-align: center;
}
.fa-stack + .fa-stack { margin-left: .3em; }
.fa-stack { margin-bottom: 20px; }

External CSS

  1. https://netdna.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css
  2. https://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css
  3. https://fonts.googleapis.com/css?family=Montserrat:700

External JavaScript

  1. //cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js