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-dark | text-dark |
.text-dark-emphasis | text-dark-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 |