Colors
Background Colors Options
Use diffrent color style to color your
element with a given table.
Background Color
.bg-primary
|
|
.bg-secondary
|
|
.bg-success
|
|
.bg-info
|
|
.bg-warning
|
|
.bg-danger
|
|
.bg-dark
|
|
.bg-light
|
|
.bg-body
|
Background Gradient
.bg-gradient
|
|
.bg-gradient
|
|
.bg-gradient
|
|
.bg-gradient
|
|
.bg-gradient
|
|
.bg-gradient
|
|
bg-gradient
|
|
.bg-gradient
|
Background Subtle
.bg-primary-subtle
|
|
.bg-secondary-subtle
|
|
.bg-success-subtle
|
|
.bg-info-subtle
|
|
.bg-warning-subtle
|
|
.bg-danger-subtle
|
|
.bg-dark-subtle
|
|
.bg-light-subtle
|
Background Opacity
.bg-opacity-10
|
|
.bg-opacity-25
|
|
.bg-opacity-50
|
|
.bg-opacity-75
|
|
.bg-opacity-100
|
Text Colors Options
Use diffrent color style to color your
element with a given table.
Text Color
.text-primary
|
text-primary
|
.text-primary-emphasis
|
text-primary-emphasis
|
.text-secondary
|
text-secondary
|
.text-secondary-emphasis
|
text-secondary-emphasis
|
.text-success
|
text-success
|
.text-success-emphasis
|
text-success-emphasis
|
.text-info
|
text-info
|
.text-info-emphasis
|
text-info-emphasis
|
.text-warning
|
text-warning
|
.text-warning-emphasis
|
text-warning-emphasis
|
.text-danger
|
text-danger
|
.text-danger-emphasis
|
text-danger-emphasis
|
.text-body
|
text-body
|
.text-body-emphasis
|
text-body-emphasis
|
.text-light
|
text-light
|
.text-light-emphasis
|
text-light-emphasis
|
.text-body
|
text-body
|
.text-body-emphasis
|
text-body-emphasis
|
.text-muted
|
text-muted
|
.text-body-secondary
|
text-body-secondary
|
.text-body-tertiary
|
text-body-tertiary
|
.text-black
|
text-black
|
.text-black-50
|
text-black-50
|
.text-white
|
text-white
|
.text-white-75
|
text-white-75
|
.text-white-50
|
text-white-50
|
Opacity & Text Opacity
.opacity-25
|
|
.opacity-50
|
|
.opacity-75
|
|
.opacity-100
|
|
.text-opacity-25
|
text-primary
|
.text-opacity-50
|
text-primary
|
.text-opacity-75
|
text-primary
|
.text-opacity-100
|
text-primary
|
Border Colors Options
Use diffrent color style to color your
element with a given table.
Border Color
.border-primary
|
|
.border-secondary
|
|
.border-success
|
|
.border-info
|
|
.border-warning
|
|
.border-danger
|
|
.border-dark
|
|
.border-light
|
|
.border-body
|
Background Subtle
.border-primary-subtle
|
|
.border-secondary-subtle
|
|
.border-success-subtle
|
|
.border-info-subtle
|
|
.border-warning-subtle
|
|
.border-danger-subtle
|
|
.border-dark-subtle
|
|
.border-light-subtle
|
|
.border-body-subtle
|
Background Opacity
.border-opacity-10
|
|
.border-opacity-25
|
|
.border-opacity-50
|
|
.border-opacity-75
|
|
.border-opacity-100
|
|