Color utilities
Background classes
Apply the following classes to modify the background color of any element.
bg-primary bg-default bg-success bg-info bg-warning bg-danger Background hover classes
Apply the following classes to modify the background color of any element on hover.
bg-primary bg-primary-hover bg-default bg-default-hover bg-success bg-success-hover bg-info bg-info-hover bg-warning bg-warning-hover bg-danger bg-danger-hover Additional color weights
Each color can be extended by adding and additional weight to the class.
bg-primary-100 bg-primary-200 bg-primary-300 bg-primary-400 bg-primary-500 bg-primary-600 bg-primary-700 bg-primary-800 bg-primary-900 bg-default-100 bg-default-200 bg-default-300 bg-default-400 bg-default-500 bg-default-600 bg-default-700 bg-default-800 bg-default-900 bg-success-100 bg-success-200 bg-success-300 bg-success-400 bg-success-500 bg-success-600 bg-success-700 bg-success-800 bg-success-900 bg-info-100 bg-info-200 bg-info-300 bg-info-400 bg-info-500 bg-info-600 bg-info-700 bg-info-800 bg-info-900 bg-warning-100 bg-warning-200 bg-warning-300 bg-warning-400 bg-warning-500 bg-warning-600 bg-warning-700 bg-warning-800 bg-warning-900 bg-danger-100 bg-danger-200 bg-danger-300 bg-danger-400 bg-danger-500 bg-danger-600 bg-danger-700 bg-danger-800 bg-danger-900 Text Color classes
Apply the following classes to modify the color of any element.
color-primary Hello world!
Hello world!
color-default Hello world!
Hello world!
color-success Hello world!
Hello world!
color-info Hello world!
Hello world!
color-warning Hello world!
Hello world!
color-danger Hello world!
Hello world!
Border Color classes
Apply the following classes to modify the border color of any element.
border-color-primary Hello world!
border-color-default Hello world!
border-color-success Hello world!
border-color-info Hello world!
border-color-warning Hello world!
border-color-danger Hello world!