diff --git a/pages/UI/buttons.html b/pages/UI/buttons.html
index bd6fb494b..8e195bfde 100644
--- a/pages/UI/buttons.html
+++ b/pages/UI/buttons.html
@@ -1803,6 +1803,28 @@
                   <span class="badge bg-danger">531</span>
                   <i class="fas fa-heart"></i> Likes
                 </a>
+
+                <p>Application Buttons with Custom Colors</p>
+                <a class="btn btn-app bg-secondary">
+                  <span class="badge bg-success">300</span>
+                  <i class="fas fa-barcode"></i> Products
+                </a>
+                <a class="btn btn-app bg-success">
+                  <span class="badge bg-purple">891</span>
+                  <i class="fas fa-users"></i> Users
+                </a>
+                <a class="btn btn-app bg-danger">
+                  <span class="badge bg-teal">67</span>
+                  <i class="fas fa-inbox"></i> Orders
+                </a>
+                <a class="btn btn-app bg-warning">
+                  <span class="badge bg-info">12</span>
+                  <i class="fas fa-envelope"></i> Inbox
+                </a>
+                <a class="btn btn-app bg-info">
+                  <span class="badge bg-danger">531</span>
+                  <i class="fas fa-heart"></i> Likes
+                </a>
               </div>
               <!-- /.card-body -->
             </div>