1. Bootstrap
  2. Colors

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 me-4"></div>
        <div>
            <strong>Primary</strong><br />
            <code>.bg-primary</code>
        </div>
    </div>

Gradient colors

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