Color
Utilities for controlling an element's text color and background color.
Text Color
Class |
Properties |
Example |
.color-primary |
color: #636AFF; |
Lorem ipsum dolor |
.color-danger |
color: #ff2d20; |
Lorem ipsum dolor |
.color-success |
color: #15CD72; |
Lorem ipsum dolor |
.color-info |
color: #0069ff; |
Lorem ipsum dolor |
.color-warning |
color: #ED6E33; |
Lorem ipsum dolor |
.color-black |
color: #000000; |
Lorem ipsum dolor |
.color-dark |
color: #212121; |
Lorem ipsum dolor |
.color-mute |
color: #616161; |
Lorem ipsum dolor |
.color-thin |
color: #dbdbdb; |
Lorem ipsum dolor |
.color-weak |
color: #e5e5e5; |
Lorem ipsum dolor |
.color-shade |
color: #eeeeee; |
Lorem ipsum dolor |
.color-light |
color: #f7f7f7; |
Lorem ipsum dolor |
.color-white |
color: #fff; |
Lorem ipsum dolor |
Background Color
Class |
Properties |
Example |
.bg-primary |
background-color: #636AFF; |
|
.bg-danger |
background-color: #ff2d20; |
|
.bg-success |
background-color: #15CD72; |
|
.bg-info |
background-color: #0069ff; |
|
.bg-warning |
background-color: #ED6E33; |
|
.bg-black |
background-color: #000000; |
|
.bg-dark |
background-color: #212121; |
|
.bg-mute |
background-color: #616161; |
|
.bg-thin |
background-color: #dbdbdb; |
|
.bg-weak |
background-color: #e5e5e5; |
|
.bg-shade |
background-color: #eeeeee; |
|
.bg-light |
background-color: #f7f7f7; |
|
.bg-white |
background-color: #fff; |
|