"Fat and Flat blue button"
Bootstrap 3.3.0 Snippet by pukey22

<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> <!------ Include the above in your HEAD tag ----------> <head> <link href="http://netdna.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.css" rel="stylesheet"> </head> <div class="container"> <div class="row"> <button href="#" class="btn btn-xlarge" /> <font style="font-size: 13px;">Get Started For Just </font></br> <b style="font-size: 50px;">$99</b>/Month<br/> <font style="font-size: 18px;">Secure Payments By</font></br> <i class="fa fa-cc-paypal fa-5x" ></i></br> Cancel Anytime</br> </br> <i class="fa fa-cc-visa fa-3x"></i> <i class="fa fa-cc-mastercard fa-3x"></i> <i class="fa fa-cc-discover fa-3x"></i> <i class="fa fa-cc-amex fa-3x"></i> <br/> No Paypal Account Needed </button> <button href="#" class="btn btn-xlarge" /> <b style="font-size: 40px;">$99</b>/Month<br/> <b style="font-size: 40px;">ADD TO CART<br/> </button> </div> </div>
/* Blue Flat Button ==================================================*/ .btn-xlarge{ position: relative; vertical-align: center; margin: 30px; /*width: 100%;*/ height: 100x; padding: 48px 48px; font-size: 22px; color: white; text-align: center; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25); background: #62b1d0; border: 0; border-bottom: 3px solid #9FE8EF; cursor: pointer; -webkit-box-shadow: inset 0 -3px #9FE8EF; box-shadow: inset 0 -3px #9FE8EF; } .btn-xlarge:active { top: 2px; outline: none; -webkit-box-shadow: none; box-shadow: none; } .btn-xlarge:hover { /* background: #45E1E8; */ /* color: white; */ }

Related: See More


Questions / Comments: