"Modern 3D Buttons"
Bootstrap 3.1.0 Snippet by marianico2

Post to Facebook Tweet this

<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.1.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 ----------> <body> <div class="container"> <div class="row"> <button class="btn btn-sm btn-default">Default</button> <button class="btn btn-sm btn-primary">Primary</button> <button class="btn btn-sm btn-info">Info</button> <button class="btn btn-sm btn-success">Success</button> <button class="btn btn-sm btn-danger">Danger</button> <button class="btn btn-sm btn-warning">Warning</button> <br> <br> <button class="btn btn-default">Default</button> <button class="btn btn-primary">Primary</button> <button class="btn btn-info">Info</button> <button class="btn btn-success">Success</button> <button class="btn btn-danger">Danger</button> <button class="btn btn-warning">Warning</button> <br> <br> <button class="btn btn-lg btn-default">Default</button> <button class="btn btn-lg btn-primary">Primary</button> <button class="btn btn-lg btn-info">Info</button> <button class="btn btn-lg btn-success">Success</button> <button class="btn btn-lg btn-danger">Danger</button> <button class="btn btn-lg btn-warning">Warning</button> </div> </div> </body>
@import url(http://fonts.googleapis.com/css?family=Raleway:400,700,600); .container {margin-top:40px;} *{font-family: 'Raleway' !important} .btn{-webkit-transition: all 200ms ease-out; -moz-transition: all 200ms ease-out; -ms-transition: all 200ms ease-out; -o-transition: all 200ms ease-out; transition: all 200ms ease-out; text-transform: uppercase; font-weight: 700; padding: 20px 30px; font-size: 16px;} .btn:not(a) {border:0;border-bottom:0;border-left:0;font-weight:'900'; sans-serif;box-shadow: inset 0 -3.2px rgba(0, 0, 0, 0.12),inset 0px 0 rgba(0, 0, 0, 0.1);outline:none;-webkit-outline:none;-o-outline:none;-moz-outline:none;} .btn:active:not(a), .btn.active {outline:none;-moz-outline:none;background-image: none;-webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125) !important;position: relative;box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125) !important;top: 1px;} .btn:focus:not(a) {outline:none;-webkit-outline:none;-moz-outline:none;} .btn-sm {padding-top:1.5px;}

Related: See More

Now UI Dashboard
Ribbon Buttons
Сonvenient buttons

Questions / Comments: