<!-- دکمه‌های پیش‌فرض -->
                                                                    <button type="button" class="btn btn-primary">اولیه</button>
                                                                    <button type="button" class="btn btn-secondary">ثانویه</button>
                                                                    <button type="button" class="btn btn-success">موفقیت</button>
                                                                    <button type="button" class="btn btn-info">اطلاعات</button> 
                                                                    <button type="button" class="btn btn-warning">هشدار</button>
                                                                    <button type="button" class="btn btn-danger">خطر</button>
                                                                    <button type="button" class="btn btn-dark">تاریک</button>
                                                                    <button type="button" class="btn btn-purple">بنفش</button>
                                                                    <button type="button" class="btn btn-pink">صورتی</button>
                                                                    <button type="button" class="btn btn-orange">نارنجی</button>
                                                                    <button type="button" class="btn btn-light">روشن</button>
                                                                    <button type="button" class="btn btn-link">لینک</button>
                                                                
                                                            

                                                                
                                                                    <!-- دکمه‌های گرد -->
                                                                    <button type="button" class="btn btn-primary rounded-pill">اولیه</button>
                                                                    <button type="button" class="btn btn-secondary rounded-pill">ثانویه</button>
                                                                    <button type="button" class="btn btn-success rounded-pill">موفقیت</button>
                                                                    <button type="button" class="btn btn-info rounded-pill">اطلاعات</button>
                                                                    <button type="button" class="btn btn-warning rounded-pill">هشدار</button>
                                                                    <button type="button" class="btn btn-danger rounded-pill">خطر</button>
                                                                    <button type="button" class="btn btn-dark rounded-pill">تاریک</button>
                                                                    <button type="button" class="btn btn-purple rounded-pill">بنفش</button>
                                                                    <button type="button" class="btn btn-pink rounded-pill">صورتی</button>
                                                                    <button type="button" class="btn btn-orange rounded-pill">نارنجی</button>
                                                                    <button type="button" class="btn btn-light rounded-pill">روشن</button>
                                                                    <button type="button" class="btn btn-link rounded-pill">لینک</button>
                                                                
                                                            

                                                                
                                                                    <!-- دکمه‌های حاشیه‌دار -->
                                                                    <button type="button" class="btn btn-outline-primary">اولیه</button>
                                                                    <button type="button" class="btn btn-outline-secondary">ثانویه</button>
                                                                    <button type="button" class="btn btn-outline-success">موفقیت</button>
                                                                    <button type="button" class="btn btn-outline-info">اطلاعات</button>
                                                                    <button type="button" class="btn btn-outline-warning">هشدار</button>
                                                                    <button type="button" class="btn btn-outline-purple">بنفش</button>
                                                                    <button type="button" class="btn btn-outline-pink">صورتی</button>
                                                                    <button type="button" class="btn btn-outline-orange">نارنجی</button>                                                        
                                                                
                                                            

                                                                
                                                                    <!-- دکمه‌های حاشیه‌دار -->
                                                                    <button type="button" class="btn btn-outline-primary rounded-pill">اولیه</button>
                                                                    <button type="button" class="btn btn-outline-secondary rounded-pill">ثانویه</button>
                                                                    <button type="button" class="btn btn-outline-success rounded-pill">موفقیت</button>
                                                                    <button type="button" class="btn btn-outline-info rounded-pill">اطلاعات</button>
                                                                    <button type="button" class="btn btn-outline-warning rounded-pill">هشدار</button>                                                           
                                                                
                                                            

                                                                
                                                                    <!-- دکمه‌های نرم -->
                                                                    <button type="button" class="btn btn-soft-primary">اولیه</button>
                                                                    <button type="button" class="btn btn-soft-secondary">ثانویه</button>
                                                                    <button type="button" class="btn btn-soft-success">موفقیت</button>
                                                                    <button type="button" class="btn btn-soft-info">اطلاعات</button>
                                                                    <button type="button" class="btn btn-soft-warning">هشدار</button>
                                                                
                                                            

                                                                
                                                                    <button type="button" class="btn btn-soft-primary rounded-pill">اولیه</button>
                                                                    <button type="button" class="btn btn-soft-secondary rounded-pill">ثانویه</button>
                                                                    <button type="button" class="btn btn-soft-success rounded-pill">موفقیت</button>
                                                                    <button type="button" class="btn btn-soft-info rounded-pill">اطلاعات</button>
                                                                    <button type="button" class="btn btn-soft-warning rounded-pill">هشدار</button>                                                         
                                                                
                                                            

                                                                
                                                                    <button type="button" class="btn btn-primary width-xl">بسیار بزرگ</button>
                                                                    <button type="button" class="btn btn-secondary width-lg">بزرگ</button>
                                                                    <button type="button" class="btn btn-success width-md">متوسط</button>
                                                                    <button type="button" class="btn btn-info width-sm">کوچک</button>
                                                                    <button type="button" class="btn btn-warning width-xs">بسیار کوچک</button>                                                          
                                                                
                                                            

                                                                
                                                                    <!-- اندازه دکمه‌ها -->
                                                                    <button type="button" class="btn btn-primary btn-lg">بزرگ</button>
                                                                    <button type="button" class="btn btn-secondary">معمولی</button>
                                                                    <button type="button" class="btn btn-success btn-sm">کوچک</button>
                                                                
                                                            

                                                                
                                                                    <!-- دکمه غیرفعال -->
                                                                    <button type="button" class="btn btn-primary" disabled>اولیه</button>
                                                                    <button type="button" class="btn btn-secondary" disabled>ثانویه</button>
                                                                    <button type="button" class="btn btn-success" disabled>موفقیت</button>
                                                                    <button type="button" class="btn btn-info" disabled>اطلاعات</button>
                                                                    <button type="button" class="btn btn-warning" disabled>هشدار</button>
                                                                
                                                            

                                                                
                                                                    <!-- دکمه آیکونی -->
                                                                    <button type="button" class="btn btn-primary">
                                                                        <i class="bx bx-heart"></i>
                                                                    </button>
                                                                    <button type="button" class="btn btn-secondary">
                                                                        <i class="bx bx-user-voice"></i>
                                                                    </button>
                                                                    <button type="button" class="btn btn-success">
                                                                        <i class="bx bx-check-double"></i>
                                                                    </button>
                                                                    <button type="button" class="btn btn-info">
                                                                        <i class="bx bx-cloud me-1"></i>خدمات ابری
                                                                    </button>
                                                                    <button type="button" class="btn btn-warning">
                                                                        <i class="bx bx-info-circle me-1"></i>هشدار
                                                                    </button>
                                                                
                                                            

                                                                
                                                                    <!-- btn-group افقی -->
                                                                    <div class="btn-group mb-1 me-1">
                                                                        <button type="button" class="btn btn-light">چپ</button>
                                                                        <button type="button" class="btn btn-light">وسط</button>
                                                                        <button type="button" class="btn btn-light">راست</button>
                                                                    </div>
                                                                    <div class="btn-group mb-1 me-1">
                                                                        <button type="button" class="btn btn-light">1</button>
                                                                        <button type="button" class="btn btn-light">2</button>
                                                                        <button type="button" class="btn btn-secondary">3</button>
                                                                        <button type="button" class="btn btn-light">4</button>
                                                                    </div>
                                                                    <div class="btn-group mb-1 me-1">
                                                                        <button type="button" class="btn btn-light">5</button>
                                                                        <button type="button" class="btn btn-secondary">6</button>
                                                                        <button type="button" class="btn btn-light">7</button>
                                                                        <button id="dropdown" type="button" class="btn btn-light dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
                                                                            کشویی
                                                                        </button>
                                                                        <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="dropdown">
                                                                            <li><a class="dropdown-item" href="javascript:void(0);">لینک کشویی</a></li>
                                                                            <li><a class="dropdown-item" href="javascript:void(0);">لینک کشویی</a></li>
                                                                        </ul>
                                                                    </div>
                
                                                                    <!-- btn-group عمودی -->
                                                                    <div class="btn-group-vertical me-4">
                                                                        <button type="button" class="btn btn-light">بالا</button>
                                                                        <button type="button" class="btn btn-light">وسط</button>
                                                                        <button type="button" class="btn btn-light">پایین</button>
                                                                    </div>
                                                                    <div class="btn-group-vertical">
                                                                        <button type="button" class="btn btn-light">دکمه 1</button>
                                                                        <button type="button" class="btn btn-light">دکمه 2</button>
                                                                        <button id="verticalDropdown" type="button" class="btn btn-light dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
                                                                            دکمه 3
                                                                        </button>
                                                                        <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="verticalDropdown">
                                                                            <li><a class="dropdown-item" href="javascript:void(0);">لینک کشویی</a></li>
                                                                            <li><a class="dropdown-item" href="javascript:void(0);">لینک کشویی</a></li>
                                                                        </ul>
                                                                    </div>
                                                                
                                                            

                                                                
                                                                    <!-- دکمه بلوکی -->
                                                                    <div class="d-grid gap-2">
                                                                        <button type="button" class="btn btn-primary btn-lg">دکمه بلوکی</button>
                                                                        <button type="button" class="btn btn-secondary">دکمه بلوکی</button>
                                                                        <button type="button" class="btn btn-light btn-sm">دکمه بلوکی</button>
                                                                    </div>