JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<div>
<button type="button"class="btn">Text</button>
<button type="button"class="btn disabled">Text</button>
<button type="button"class="btn disabled" disabled="disabled">Text</button>
</div>
<div>
<button type="button"class="btn btn-primary">Text</button>
<button type="button"class="btn btn-primary disabled">Text</button>
<button type="button"class="btn btn-primary disabled" disabled="disabled">Text</button>
</div>
CSS
.btn:disabled,
.btn.disabled{
color:#fff;
border-color: #a0a0a0;
background-color: #a0a0a0;
}
.btn:disabled:hover,
.btn:disabled:focus,
.btn.disabled:hover,
.btn.disabled:focus {
color:#fff;
border-color: #a0a0a0;
background-color: #a0a0a0;
}