<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
<div class="div-decorator">
<div class="div-heading">
<h3 class="text-center heading faa-horizontal faa-slow animated">Animated Rounded Button</h3>
</div>
<div class="div-content">
<h2>Medium</h2>
<button type="button" class="btn btn-default btn-circle"><i class="fa fa-fw fa-wrench faa-wrench animated"></i></button>
<button type="button" class="btn btn-primary btn-circle"><i class="fa fa-fw fa-bell faa-ring animated"></i></button>
<button type="button" class="btn btn-success btn-circle"><i class="fa fa-fw fa-envelope faa-horizontal animated"></i></button>
<button type="button" class="btn btn-info btn-circle"><i class="fa fa-fw fa-thumbs-up faa-vertical animated"></i></button>
<button type="button" class="btn btn-warning btn-circle"><i class="fa fa-fw fa-warning faa-flash animated"></i></button>
<button type="button" class="btn btn-danger btn-circle"><i class="fa fa-fw fa-map-marker faa-bounce animated"></i></button>
<h2>Large</h2>
<button type="button" class="btn btn-default btn-circle btn-lg"><i class="fa fa-spinner faa-spin animated"></i></button>
<button type="button" class="btn btn-primary btn-circle btn-lg"><i class="fa fa-plane faa-float animated"></i></button>
<button type="button" class="btn btn-success btn-circle btn-lg"><i class="fa fa-heart faa-pulse animated"></i></button>
<button type="button" class="btn btn-info btn-circle btn-lg"><i class="fa fa-envelope faa-shake animated"></i></button>
<button type="button" class="btn btn-warning btn-circle btn-lg"><i class="fa fa-trophy faa-tada animated"></i></button>
<button type="button" class="btn btn-danger btn-circle btn-lg"><i class="fa fa-space-shuttle faa-passing animated"></i></button>
<h2>Extra Large</h2>
<button type="button" class="btn btn-default btn-circle btn-xl"><i class="fa fa-space-shuttle faa-passing-reverse animated"></i></button>
<button type="button" class="btn btn-primary btn-circle btn-xl"><i class="fa fa-circle-o faa-burst animated"></i></button>
<button type="button" class="btn btn-success btn-circle btn-xl"><i class="fa fa-fw fa-envelope faa-horizontal animated"></i></button>
<button type="button" class="btn btn-info btn-circle btn-xl"><i class="fa fa-fw fa-thumbs-up faa-vertical animated"></i></button>
<button type="button" class="btn btn-warning btn-circle btn-xl"><i class="fa fa-fw fa-warning faa-flash animated"></i></button>
<button type="button" class="btn btn-danger btn-circle btn-xl"><i class="fa fa-fw fa-map-marker faa-bounce animated"></i></button>
</div>
</div>
