Loader

Contextual colors

Primary
.bg-primary
Info
.bg-info
Secondary
.bg-secondary
Warning
.bg-warning
Danger
.bg-danger
Success
.bg-success
Example: <div class="d-flex align-items-center mb-3 mt-3">
		<div class="w-7 h-7 bg-primary rounded mr-4"></div>
		<div>
			<strong>Primary</strong><br />
			<code>.bg-primary</code>
		</div>
</div>
	

Gradient colors

Primary
.bg-primary-gradient
Info
.bg-info-gradient
Secondary
.bg-secondary-gradient
Warning
.bg-warning-gradient
Danger
.bg-danger-gradient
Success
.bg-success-gradient
Example: <div class="d-flex align-items-center mb-3 mt-3">
	<div class="w-7 h-7 bg-primary rounded mr-4"></div>
	<div>
		<strong>Primary</strong><br />
		<code>.bg-primary-gradient</code>
	</div>
</div>

Other colors

Blue
.bg-blue
Red
.bg-red
Teal
.bg-teal
Azure
.bg-azure
Orange
.bg-orange
Cyan
.bg-cyan
Indigo
.bg-indigo
Yellow
.bg-yellow
Gray
.bg-gray
Purple
.bg-purple
Lime
.bg-lime
Dark Gray
.bg-gray-dark
Pink
.bg-pink
Green
.bg-green
secondary
.bg-secondary
Example: <div class="d-flex align-items-center mb-3 mt-3">
			<div class="w-7 h-7 bg-blue rounded mr-4"></div>
			<div>
				<strong>Blue</strong><br />
				<code>.bg-blue</code>
			</div>
		</div>