As you may know Bootstrap comes with several styles of buttons or if you use a Bootswatch theme you can get many more styles. But in most cases you will want your own and here is how to style a Bootstrap button to your liking:
The CSS:
.btn-custom {
color: #ffffff;
background-color: #FF8103;
border-color: #000000;
}
.btn-custom:hover,
.btn-custom:focus,
.btn-custom:active,
.btn-custom.active,
.open .dropdown-toggle.btn-custom {
color: #ffffff;
background-color: #FFBE0D;
border-color: #000000;
}
.btn-custom:active,
.btn-custom.active,
.open .dropdown-toggle.btn-custom {
background-image: none;
}
.btn-custom.disabled,
.btn-custom[disabled],
fieldset[disabled] .btn-custom,
.btn-custom.disabled:hover,
.btn-custom[disabled]:hover,
fieldset[disabled] .btn-custom:hover,
.btn-custom.disabled:focus,
.btn-custom[disabled]:focus,
fieldset[disabled] .btn-custom:focus,
.btn-custom.disabled:active,
.btn-custom[disabled]:active,
fieldset[disabled] .btn-custom:active,
.btn-custom.disabled.active,
.btn-custom[disabled].active,
fieldset[disabled] .btn-custom.active {
background-color: #FF8103;
border-color: #000000;
}
.btn-custom .badge {
color: #FF8103;
background-color: #ffffff;
}Choose your colors obviously, to use this custom button just use the class btn-custom
<a class="btn btn-custom" href="https://domain.com/link" role="button">Button text</a>
To do more custom buttons just copy the CSS above and change the colors stated.