<h1>عنوان <span class="badge bg-secondary">جدید</span></h1>
<h2>عنوان <span class="badge bg-secondary">جدید</span></h2>
<h3>عنوان <span class="badge bg-secondary">جدید</span></h3>
<h4>عنوان <span class="badge bg-secondary">جدید</span></h4>
<h5>عنوان <span class="badge bg-secondary">جدید</span></h5>
<h6>عنوان <span class="badge bg-secondary">جدید</span></h6>

<span class="badge bg-primary">پیش فرض</span>
<span class="badge bg-secondary">تایید</span>
<span class="badge bg-success">موفق</span>
<span class="badge bg-danger">خطر</span>
<span class="badge bg-warning text-dark">هشدار</span>
<span class="badge bg-info">پیغام</span>
<span class="badge bg-light text-dark">روشن</span>
<span class="badge bg-dark">تیره</span>

<a href="#" class="badge bg-primary"><i class="fas fa-circle me-2 small fw-bold"></i>پیش فرض</a>
<a href="#" class="badge bg-secondary"><i class="fas fa-circle me-2 small fw-bold"></i>تایید</a>
<a href="#" class="badge bg-success"><i class="fas fa-circle me-2 small fw-bold"></i>موفق</a>
<a href="#" class="badge bg-danger"><i class="fas fa-circle me-2 small fw-bold"></i>خطر</a>
<a href="#" class="badge bg-warning"><i class="fas fa-circle me-2 small fw-bold"></i>هشدار</a>
<a href="#" class="badge bg-info"><i class="fas fa-circle me-2 small fw-bold"></i>پیغام</a>
<a href="#" class="badge bg-light text-dark"><i class="fas fa-circle me-2 small fw-bold"></i>روشن</a>
<a href="#" class="badge bg-dark"><i class="fas fa-circle me-2 small fw-bold"></i>تیره</a>

<a href="#" class="badge bg-primary bg-opacity-10 text-primary">پیش فرض</a>
<a href="#" class="badge bg-secondary-soft text-secondary">تایید</a>
<a href="#" class="badge bg-success bg-opacity-10 text-success">موفق</a>
<a href="#" class="badge bg-danger bg-opacity-10 text-danger">خطر</a>
<a href="#" class="badge bg-warning bg-opacity-15 text-warning">هشدار</a>
<a href="#" class="badge bg-info bg-opacity-10 text-info">پیغام</a>
<a href="#" class="badge bg-dark-soft text-dark">تیره</a>