Banyak Kelas Background Bawaan (bg-)

Bootstrap menyediakan banyak kelas background bawaan (`bg-`) untuk berbagai warna. Berikut adalah daftar lengkapnya:

---

## **✅ Daftar Kelas `bg-` di Bootstrap**
| **Kelas** | **Warna** | **Kode Warna** |
|-----------|----------|---------------|
| `bg-primary` | Biru | `#0d6efd` |
| `bg-secondary` | Abu-abu | `#6c757d` |
| `bg-success` | Hijau | `#198754` |
| `bg-danger` | Merah | `#dc3545` |
| `bg-warning` | Kuning | `#ffc107` |
| `bg-info` | Biru Muda | `#0dcaf0` |
| `bg-light` | Abu Muda | `#f8f9fa` |
| `bg-dark` | Hitam Abu-Abu | `#212529` |
| `bg-white` | Putih | `#ffffff` |
| `bg-transparent` | Transparan | `rgba(0,0,0,0)` |

---

## **✅ Variasi `bg-gradient`**
Bootstrap juga menyediakan **gradient untuk setiap warna**, cukup tambahkan `-gradient`:

| **Kelas** | **Deskripsi** |
|-----------|--------------|
| `bg-primary bg-gradient` | Gradien biru |
| `bg-success bg-gradient` | Gradien hijau |
| `bg-danger bg-gradient` | Gradien merah |
| `bg-warning bg-gradient` | Gradien kuning |
| `bg-info bg-gradient` | Gradien biru muda |
| `bg-dark bg-gradient` | Gradien hitam abu |

---

## **✅ Variasi `opacity` (Bootstrap 5.3+)**
Jika menggunakan **Bootstrap 5.3 atau lebih baru**, bisa menambahkan **opacity**:

| **Kelas** | **Efek** |
|-----------|---------|
| `bg-success bg-opacity-10` | Hijau dengan transparansi 10% |
| `bg-success bg-opacity-25` | Hijau dengan transparansi 25% |
| `bg-success bg-opacity-50` | Hijau dengan transparansi 50% |
| `bg-success bg-opacity-75` | Hijau dengan transparansi 75% |
| `bg-success bg-opacity-100` | Hijau full opacity (default) |

---

## **🔥 Contoh Penggunaan di HTML**
```html
<div class="bg-success text-white p-3">Ini adalah kotak dengan background hijau</div>
<div class="bg-danger text-white p-3">Ini adalah kotak dengan background merah</div>
<div class="bg-warning text-dark p-3">Ini adalah kotak dengan background kuning</div>
<div class="bg-dark text-light p-3">Ini adalah kotak dengan background hitam abu-abu</div>
<div class="bg-info text-white p-3">Ini adalah kotak dengan background biru muda</div>
```

---

🚀 **Sekarang Anda bisa memilih `bg-` yang sesuai untuk desain website Anda!** Jika butuh kombinasi warna lain, beri tahu saya. 😊