How to change bootstrap modal header colors (backgrond & text)

Question

How could I change the bootstrap modal header background to dark-blue and the text to white. Fiddle is here :

https://www.bootply.com/kzdpQurfsl

Answer 1

You can try to use the following CSS:

.modal-header {
  background-color: darkblue;
  color: white;
}

Fiddle is here.

Answer 2

Rather than changing the colours of all the modals why not add this to an extension CSS file.

.modal-header.primary {
  color: #fff;
  background-color: #337ab7;
  border-color: #337ab7;
}

and then add primary to your modal-header thus:

<div class="modal-header primary">

Fiddle is here...