TorqueUI is a responsive web design centric UI Framework with components made for the modern web.
Download TorqueUI


Badges are a simple way to mark icons or make inline text highlightning.


The badge primarily is .badge class with different theming possibilities:

  • .badge-clean
  • .badge-warning
  • .badge-info
  • .badge-danger
  • .badge-succes

Checkout the code example below, that shows how text and icons can be interchanged.


Badges work with text and icons
<span class="badge">Badge</span>
<span class="badge badge-clean"><i class="fa fa-bolt"></i></span>
<span class="badge badge-warning"><i class="fa fa-warning"></i></span>
<span class="badge badge-info"><i class="fa fa-info-circle"></i></span>
<span class="badge badge-danger"><i class="fa fa-close"></i></span>
<span class="badge badge-succes"><i class="fa fa-check"></i></span>
<span class="badge">Badges</span>
<span class="badge badge-clean">work</span>
<span class="badge badge-warning">with</span>
<span class="badge badge-info">text</span>
<span class="badge badge-danger">and</span>
<span class="badge badge-succes"><i class="fa fa-check"></i> icons</span>
  • © TorqueUI